Twenty Twelve
[resolved] Center the header? (8 posts)

  1. rachel
    Posted 3 years ago #


    Apologies if this has been covered before, but I'm trying to center the entire header for my site using the awesome twenty twelve theme.

    As you can see from my site: http://www.squidinkediting.com

    I was able to center the header image, but I can't figure out how to center the rest.


  2. Tara
    Volunteer Moderator
    Posted 3 years ago #

    - Try using Firefox with the Firebug add-on for this kind of CSS work. http://getfirebug.com/

  3. Andrew Nevins
    Forum moderator
    Posted 3 years ago #

    Make your CSS changes through this plugin http://wordpress.org/extend/plugins/custom-css-manager-plugin/

  4. rachel
    Posted 3 years ago #

    Thanks for those suggestions. Which class/id do I need to edit to get the custom image center-aligned?

    Looks like this works on Chrome and Safari but it's still left-aligned in FF.


  5. paulwpxp
    Font hero
    Posted 3 years ago #

    Looks like you got header.php edited without child theme.

    Create a child theme

    and put your version of header.php in your child theme's folder, make sure the parent theme is fresh ( unedited ).

    Move <div id="title"> out from the <hgroup>

    so now you will have this structure

    	<div id="title">...</div>

    Take out all the align="center", for centering an image just use class="aligncenter" right in the <img> 's attribute.

    Adjust anything else like margin, or padding in your child theme's style.css

  6. rachel
    Posted 3 years ago #

    Thanks for this--do you mean that I should move

    <div id= title=<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>

    out from under <hgroup>?

    Once I do that, where does my header image go?


  7. paulwpxp
    Font hero
    Posted 3 years ago #

    1. Yes.
    2. Look at the structure, it goes to the top, outside of it.

    Anyway, <hgroup> has just been removed from HTML5 specification, so all the HTML5 themes will soon be updated and folks who make a copy of header.php for child theme will have to edit this too.

    So you don't have to worry about moving that out of <hgroup> anymore.

  8. rachel
    Posted 3 years ago #

    You're great. Thanks very much.

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic