nav full width on twentytwelve

The navigation looks full-width to me. Do you the elements to be spread out like justified text?

See how the top brown bar goes across the entire site. I need the nav to go 100% across the page, but I was hoping there’s a better way to do it than adding the red to the background image>

That’s doable if the navigation menu is going to have a static width, i.e you won’t rename, edit or remove webpages. I don’t think that’s realistic.

as a pure formatting problem, this might be better discusssed in a css forum like https://csscreator.com/forum;

if you can make sure the header is a constant height, integrating the menu strip into the background image seems to be the easiest option.

if this does not work, it would possibly involve restructuring the html structure of the theme.

more problematic seem to me the changes in the layout when you narrow the browser screen, or when you view the site on small devices…

html { background:url('images/fade.jpg') repeat-x scroll 0 0 transparent !important; }

body { background:url('images/red.png') repeat-x scroll 0 167px transparent !important; }

I ended up using the background fade in the html and the red nav in the body. I figure it’s more ‘pro-joe’ than one background image.

What do you think?