<分区>
我正在尝试为臭名昭著的 IE z-index 错误找到解决方法。我已经阅读了来自 Google 的各种文章,但仍然发现我的下拉菜单出现在 Accordion 面板后面。我已经发布了我的代码,如果有人能帮助我理解我哪里出错了,我将不胜感激。我试过 ie9 及以下的版本。谢谢
CSS代码
#menu {
list-style:none;
width:97%;
margin:20px auto 0px auto;
height:43px;
padding:0px 20px 0px 20px;
color: black;
}
#menu li {
float:left;
display:block;
text-align:center;
position:relative;
padding: 4px 10px 4px 10px;
margin-right:30px;
margin-top:7px;
border:none;
z-index:1000;
}
最佳答案
您需要回到 IE 和定位的基础。
主要要考虑的是主要元素在 DOM 中的位置,即文档结构。
对于初学者,您需要给#menu 一个“相对”位置和 z-index。
您还需要确定为 Accordion 设置了哪些规则。
将一些元素的 z-index 设置为“1000”并希望最好的结果不会被 IE 削减。
使用您的文档结构,将您的页面容器/包装器视为“z-index:0”,如果需要,在您测试时设置它。
然后遍历各种元素、标题、导航等并检查它们的位置、z-index 等并增加图层。
<div id="container"> <<<<< 0
<header> <<<<< 1
<div id="accordion"></div> <<<<< 2
<nav id="menu></nav> <<<<< 3
</header>
</div>
关于css - 即 z-index 不出现在元素后面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17063902/