IE6中多个绝对定位和相对定位重叠时z-index失效的问题
来源:互联网 发布:物理名师课堂软件 编辑:程序博客网 时间:2024/06/08 04:05
这是一个很奇怪的问题,但也能够理解,只有IE6才会出现,今天做一个东西,在IE8 FF GOOGLE 360都测试OK,唯独IE6的下拉菜单总被下面正文中滚动的banner遮挡,明明 下拉菜单的z-index已经很大了。
<div class="a"> //position:relative 主要是下拉菜单的位置要相对于这个父元素
<div class="b"> //position:absolute z-index:100 下菜菜单的容器
</div>
</div>
<div class="c">
<div class="d">//position:absolute z-index:20
</div>
</div>
如果像这个代码,ie6下 那么下拉菜单b伸出来的内容会被d遮挡住,即使z-index设置的层级是对的,其它浏览器没问题。
原因很简单,因为 a 没有设置层级, b是a的儿子,在ie6排列叠加时,已经把a排到d下面了,与b无关,只要设置了a的z-
index小于d 就行了,这个问题只有ie6有, ie8 e60 googe ff等都测试是没问题的。
一般情况下很少用到position:relative 也要设置z的情况,因为布局从不曾那么巧合,这个问题在逻辑上是能够理解的,
不要一直以为position:absolute 的层叠是全文档一致的, 如果有父无并设置了相对定位,那么ie6就只拿父元素和其它的元素来比较了。
- IE6中多个绝对定位和相对定位重叠时z-index失效的问题
- css中的float和相对定位,绝对定位,z-index
- 相对定位、绝对定位、z-index
- 定位(相对、绝对)、z-index
- 08-CSS 相对定位 绝对定位 固定定位 z-index
- 07 CSS-相对定位、绝对定位、固定定位、z-index
- 2.8 CSS相对定位&&绝对定位&&固定定位&&z-index
- 07 CSS-相对定位、绝对定位、固定定位、z-index
- CSS相对定位|绝对定位(五)之z-index篇
- CSS相对定位|绝对定位(五)之z-index篇
- CSS相对定位|绝对定位(五)之z-index篇
- IE7 绝对定位z-index 层级问题
- IE6/IE7下父元素有相对/绝对定位时,子元素在IE6和IE7下overflow:hidden;失效。
- 说说positon相对定位和绝对定位的问题
- css的相对定位和绝对定位
- css的相对定位和绝对定位
- CSS的相对定位和绝对定位
- 相对定位和绝对定位的区别
- asp.net c#基于DEC的加密与解密
- 关于style.filter失效的可能情况之一
- .net 2.0与.net 4.0在母板页生成标签上的一个差异
- 给ff的专用的一个css hack
- mfc ListControl 重绘网格线
- IE6中多个绝对定位和相对定位重叠时z-index失效的问题
- .net2.0 Intelligencia.UrlRewriter在(iis6,iis7)伪静态的实现
- 扫盲:js改变css文件中display:none的设置
- ie9 img.complete
- 一个优秀的html文档头部
- 【转载】HTTP 错误 404.17 - Not Found 请求的内容似乎是脚本,因而将无法由静态文件处理程序来处理
- 一个简单的ie6和其它浏览器区分以及设置png24的透明
- 正常安装版win7修改host和ping生效的相关的设置
- paip.提升用户体验----gcc c++ JIT-debugging 技术