WordPress.org

Forums

Twenty Twelve
Auto resize background (20 posts)

  1. jakkuftw
    Member
    Posted 2 years ago #

    Hey,

    Someone know how to make auto size background image for child theme ? Already had search in google for some tips, but nothing usable...

  2. Andrew
    Nuh uh moderator
    Posted 2 years ago #

    Have you tried the background-size property?

  3. jakkuftw
    Member
    Posted 2 years ago #

    I don't find where is css with "body.custom-background {"

  4. Andrew
    Nuh uh moderator
    Posted 2 years ago #

    Use a Browser Inspector Tool to easily find which elements have which styling.

  5. jakkuftw
    Member
    Posted 2 years ago #

    Yes. I'm using it. But in style.css dont find it:

    body.custom-background {
    background-color: #F2836B;
    background-image: url('http://www.website.com/wptest/wp-content/uploads/2012/11/background.jpg');
    background-repeat: no-repeat;
    background-position: top center;
    background-attachment: fixed;
  6. Andrew
    Nuh uh moderator
    Posted 2 years ago #

    The browser inspector tool should be enough to see the CSS styles applying to the element. You should then override or add-to these styles in your Child Theme style.css (create new code). You shouldn't modify current code in your parent theme's files.

  7. jakkuftw
    Member
    Posted 2 years ago #

    Yes I know it. But anyway background don't auto fit with browser size.. I need to see background nice with aspect ratio in any resolution. Default img aspect ratio 16:9, in 4:3 resolution img can be centered, but hidden left and right sides..

  8. Andrew
    Nuh uh moderator
    Posted 2 years ago #

    Perhaps this tutorial will help.

  9. jakkuftw
    Member
    Posted 2 years ago #

    I don't know how it is possible, but I cant find from where it's generated:

    http://img831.imageshack.us/img831/3225/cssi.jpg

  10. Andrew
    Nuh uh moderator
    Posted 2 years ago #

    It's probably generated by a plugin, but why are you concerned with this?

  11. jakkuftw
    Member
    Posted 2 years ago #

    Because I don't know where to put code from your link to tutorial.

  12. Andrew
    Nuh uh moderator
    Posted 2 years ago #

    You should add it to your Child Theme style.css file (stylesheet).

  13. jakkuftw
    Member
    Posted 2 years ago #

    Everything was fine but, need to insert

    <div style="max-width:500px;">
        <img src="..." />
    </div>

    Where put this code ?

  14. Andrew
    Nuh uh moderator
    Posted 2 years ago #

    I think that code is the equivalent of the code you added in style.css. You need not add it.

  15. jakkuftw
    Member
    Posted 2 years ago #

    I don't know but it doesnt work for me.. :/ Too noob to make it.

  16. Andrew
    Nuh uh moderator
    Posted 2 years ago #

    What code have you added into style.css, from the tutorial?

  17. jakkuftw
    Member
    Posted 2 years ago #

    Hello,

    I use in style.css:

    html {
    	background: url(images/background.jpg) no-repeat center center fixed;
    	-webkit-background-size: cover;
    	-moz-background-size: cover;
    	-o-background-size: cover;
    	background-size: cover;
    }

    Remove background image from menu and leave some bg color, because if I remove color, borders in each side dissapier.. So I have problem, website show color, but with dev tools if I remove bg with color, my img shown correctly..

  18. Andrew
    Nuh uh moderator
    Posted 2 years ago #

    Is this a separate issue?

  19. jakkuftw
    Member
    Posted 2 years ago #

    WordPress overwriting my image with Backround Color in WP Appearance options..

    Yes it's seperate.

  20. Andrew
    Nuh uh moderator
    Posted 2 years ago #

    As this is a separate issue, create a new thread for it. This will increase the likelihood of receiving help.

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic