[position: fixed ] with vertical space

[url=http://stackoverflow.com/questions/5363430/position-fixed-with-vertical-space][size=large][b]Position: fixed with vertical space[/b][/size][/url]

What I have is a rather basic issue with position: fixed.

Here's a sample: http://jsfiddle.net/wxEsY/

What I want is the scrolling to start below the black bar (with a fixed position).

Any help appreciated.

Regards


_______________________________________________________________________

Does this do it?

http://jsfiddle.net/Vqncx/

I just gave the 'content' DIV relative positioning and a y-axis from the top equal to the height of the 'nav' and then gave the 'nav' a z-index to keep it on top of the 'content'.

.nav {
 width: 100%;
 height: 50px;
 background: #000;
 position: fixed;
 z-index: 5;
}

.content {
 background: #ccc;
 width: 100%;
 height: 5000px;
 position: relative;
 top:50px;
}

_______________________________________________________________________

Add padding to second div equal to height of second div.

.content {
    padding-top: 50px;
    background: #ccc;
    width: 100%;
    height: 5000px;
}

When you say scrolling below the back bar, it sounds like you want the content to begin below the back bar. So add some padding to second div to account for presence of fixed div.

_______________________________________________________________________


-