A site I am developing is giving me some serious issues in IE7/8. On certain pages, the navigation goes underneath text and images. I'm rather confused. I've tried adding z-index of 1 to the content and a higher z-index to the navigation, but it is to no avail.
link to site with problem and respective css file:
http://exitbellaire.com/exit-air.php
the css file is /style.css
Thanks in advance!
@AnythonyWJones
Probably because I just fixed it ><
I removed a position:relative tag from a div and things started working again.
Damn you, Internet Explorer.
"It appears that if you have multiple position:relative elements in your code, then IE sets up separate Z layer contexts for each one, which ignore each other."
I think you might need to add the higher z-index attribute to the .sf-menu and other #navigation element CSS as well, in addition to the base navigation div.
Z-index doesn't have any effect on a normally-positioned element. Try adding "position: relative" to the items you've put a z-index on, one at a time, and see if there's any change. Older versions of IE have a bad habit of looking at parent z-indicies, so that while something might have a z-index of 10, if its parent has a z-index of 1, the 10 will not show up over other elements with lower z-indicies.