html - IE-7 z-index 问题 - 下拉区域在横幅下，其内容未显示在 IE-7 中

Question

我在这里创建了一个测试用例http://testcases.site44.com/在 IE-7 下拉菜单中没有出现横幅图像。在 Firefox 和 chrome 中很好。

请帮助查找问题。

Answer 1

尝试将你的元素id="footer"设置为比id="main"更高的 z-index

Answer 2

消除

z-index:1从 div id="banner" 仅对 ie-7 进行此更改

事实上仅z-index:1影响 ie-7

Answer 3

IE 在理解 z-index 方面有不同的方法。除了上述链接中非常令人讨厌的 HTML 方法外，您还应该执行以下操作：

如果您有 2 个 div，并且在第一个 div 中，有一些内容应该覆盖第二个中的内容，那么您需要在这两个 div 上设置 z-index，并为具有该内容的那个设置更高的值在另一个之上。

例子：

<div id="wrapper">
 <ul id="flyout">
 //
 </ul>
</div>
<div id="content">
 //
</div>

CSS：

#wrapper {position:relative;z-index:2;}
#flyout {position:relative;z-index:3;}
#content {position:relative;z-index:1;}

IE 现在明白第一个 div 中的内容应该超过第二个 div 中的内容。