Issue with Z-Index and IE7
I've browsed on the board a开发者_如何转开发nd tried and bunch of these solutions and I'm still stuck.
The page I'm looking at is here. In IE7, the drop downs are showing up behind the homepage content. And if you go to one of the site sections, by clicking on "Menus", they even show up behind the dynamically created side-bar.
I've given the drop down a z-index of 1000 and relative positioning. On the homepage, the images have relative positioning and a small z-index (1 or 2).
Any ideas?
You'll want to add position:relative or zoom:1 to all of the parent elements that contain your drop downs. For example:
CSS:
.posRelative { position:relative; }
Generic HTML:
...
<body>
<div id="header" class="posRelative">
<ul id="menu" class="posRelative">
<li class="posRelative">....</li>
<li class="posRelative">....</li>
<li class="posRelative">....</li>
</ul>
</div>
...
Clearly there are more efficient ways of applying that style property, but hopefully you get the idea.
I think it is because of the absolute positioning of the ul. Internet Explorer creates a new z-index for anything that is absolutely positioned.
See if you can change them to be relatively positioned.
You can try this fix as well http://brenelz.com/blog/squish-the-internet-explorer-z-index-bug/, works for IE6 and saved me some times on IE7 as well. You need to set the z-Index properties only for IE6&7 and do the contrary of the logic.
加载中,请稍侯......
精彩评论