WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I seem to have a problem customizing the Twenty Eleven theme. I would like that the top header above the header image to have a background color that goes from side to side in the window. Found out that the problem may come from max-width set to 1000px, but could not find where to put it so it doesn't mess up the theme elsewhere.

How can I achieve to have a color on the top of the page (ex. like facebook top blue header) that has the width of the browser?

share|improve this question
up vote 0 down vote accepted

In your Twenty Eleven child theme (don’t edit the main theme!) create a new header.php file, copy the content from the parent theme, and replace this part:

<body <?php body_class(); ?>>
<div id="page" class="hfeed">

… with something like this:

<body <?php body_class(); ?>>
<div style="background:#345;color:#eee;padding:10px 20px;margin:0 -2em">Hello</div>
<div id="page" class="hfeed">

But move the CSS into a copy of the style.css, and adjust the styles in the media queries too, because body doesn’t have a padding in smaller windows, and you have to remove the negative margin then.

share|improve this answer
Thank you, will try it later today and check back with the results. – dare2k Oct 30 '12 at 11:03
It worked, thanks for your advice! – dare2k Oct 30 '12 at 17:34

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.