iStack iStack - 2 years ago 108
HTML Question

Position fixed header hidden behind content after using relative and absolute for content

I'm trying to achieve a header that will be fixed whenever I scroll so I used position:fixed for it

But then when I try to use relative and absolute for the content, the header gets hidden behind the content(image)

Thanks for any help in advance!


Full screen:

Answer Source

Just add a z-index to the navigation. Since it appears before the content in the DOM it will be displayed BELOW it on the z-axis. Force it to a higher than 0 z-index as below:

.navbar {
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download