Resolved Overall Layout Issue

[fbm88]

Hey all,

I've got some basic self-learned experience when it comes to coding in CSS and HTML. I'm currently running a Wordpress blog (www.freshbornmarket.com), and the CSS edits i'm trying to make are more complicated than anything i've messed around with before.

What I'm trying to do is have that black navigation bar hang over each side (see bottom image). By lengthening it, i can make it float over one side at a time, but not both. The bar is contained by a content div with 20px padding on each side.

Any idea how I could achieve this look? Sorry about the large images.


CURRENT:



DESIRED RESULT:

[SB65]

There's a few ways of doing this. Perhaps:

#masthead{
position:relative;
padding-bottom:38px}

#access {
-moz-box-shadow:3px 2px 0 #D9D9D9;
background:none repeat scroll 0 0 #000000;
bottom:0;
display:block;
left:-40px;
position:absolute;
width:1020px;
}

So here we're using absolute positioning which is the easiest way to move your navigation outside of the normal wrapper width.

[fbm88]

Wow, that was easy. Thanks a ton for the fast help. I'll be sticking around here to do what i can!