WordPress.org

Ready to get started?Download WordPress

Forums

how to center twentyeleven header image? (9 posts)

  1. Walid
    Member
    Posted 2 years ago #

    hello, I attached an image to what I achieved, made my logo smaller but can't center the logo as in the image:

    http://img109.imageshack.us/img109/1139/twentyelevenscreen.gif

    how to center the pink logo? and if it's possible can I remove the white background from around the logo?
    thanks for you help :)

  2. futurepocket
    Member
    Posted 2 years ago #

    Assign a div class to the image and modify your CSS to move the image to the center. You want to remove the complete white background? Where would you position the nav bar? You would still need some sort of background.

  3. alchymyth
    The Sweeper & Moderator
    Posted 2 years ago #

    the white is the background of the div with the css id #page. to have the header area outside/before the start of the #page div, to make it ransparent, would need quite complex changes to the html structure of the theme.

  4. Walid
    Member
    Posted 2 years ago #

    @futurepocket @alchymyth thanks for your help, I can ignore the white background thing, it doesn't look that bad, but I want to understand how to center the header image in twenty-eleven, I tried to put align center in #brandimage in styles.css but it failed, can you explain how I can do what you described:

    Assign a div class to the image and modify your CSS to move the image to the center.

    Thanks :)

  5. Caroline Moore
    Member
    Posted 2 years ago #

    It would be easier to help if we could see your actual website/CSS. Try setting #brandimage to text-align: center, not align: center.

  6. Walid
    Member
    Posted 2 years ago #

    @sixhours I tried both align Center and text align Center, both didn't work for some reason, perhaps something special needed for twenty-eleven css?

  7. futurepocket
    Member
    Posted 2 years ago #

    Align: center and text-align: center don't work.. like I said, you will have to use margin-left to center the image because margin: auto doesn't work in IE.

  8. Walid
    Member
    Posted 2 years ago #

    Align: center and text-align: center don't work.. like I said, you will have to use margin-left to center the image because margin: auto doesn't work in IE.

    sorry, but I'm trying in my local host since yesterday for just centering this header image with no result, so can you please guide me how to do it exactly?

  9. otreva
    Member
    Posted 1 year ago #

    Try changing the following:

    #branding hgroup {
    	margin: 0 auto;
    	text-align:center;
    }

Topic Closed

This topic has been closed to new replies.

About this Topic