Hi Neomie,
I viewed your site using Firefox with the Firebug plugin and see the following information about your header image and navigation bar:
This bit of code IDs the style for your banner:
<header id="branding" role="banner">
This code IDs the style for your navigation bar:
<nav role="navigation" id="access">
Now let’s look in your style.css file. You should see this width for #access:
width: 947px;
In the same file (style.css) this is the width currently set for #branding img:
width: 100%;
You can either change the width for #access to 100% or you can change the width for #branding img to 947px.
Hope this helps!
the purple bar is the problem;
most elements in Twenty Eleven are flexible width, while the purple bar seems to be styled with s fixed width.
rezize your browser window to see for yourself.
remove the ‘width’ from this style:
#access {
background: #9966ff;
display: block;
float: left;
margin: 0 auto;
width: 947px;
}
ideally, move and merge the whole style with the original one a few lines earlier in style.css (shortend just to show it here):
#access {
background: #9966ff; /* Show a solid color for older browsers */
background: -moz-linear-gradient(#252525, #0a0a0a);
...;
width: 100%;
}
http://www.w3schools.com/css/
btw and important:
please don’t edit Twenty Eleven directly, but create a child theme http://codex.wordpress.org/Child_Themes and make the edit in there.
this will also help to keep your customisations safe from getting overwritten with your next upgrade.
Thread Starter
Neomie
(@neomie)
Thank you so much, ChristiNI and Alchymyth – this is all so helpful and I am a lot clearer now on where I go from here.
You are both so kind to assist those of us who are just starting out
I hope some day to be able to help others too.
Neo
Thread Starter
Neomie
(@neomie)
Just popped back to say the issue is resolved and you guys are the greatest. Thanks a mill
