Mac Luc
Mac Luc

Reputation: 1001

Keep a div at top of page, but beneath other divs

I want to have a div with a background image at the top of my website. But when the page is scrolled the div should go underneath the other divs (while still at the top of the page) and not on top of them (as fixed positioning would).
I guess its not possible with CSS? But javascript/jquery?

Upvotes: 0

Views: 37

Answers (1)

James Korden
James Korden

Reputation: 634

Try setting your top bar/image to a lower z-index.

z-index: -1;

See example at http://jsfiddle.net/a6zdfewx/

Note: If you have a background on your site (set in the body) this will go behind it and will not be viewable. You'd need to push forward other elements with something like z-index: 2 for all elements except this which would then be z-index: 1.

Upvotes: 3

Related Questions