当前位置:首页> 正文
IE6 Bug overflow:hidden失效
下面就是我所收集或遇到的IE6 Bug之一:overflow:hidden失效
当父元素的直接子元素或者下级子元素的样式拥有position:relative属性时,父元素的overflow:hidden属性就会失效。
CSS代码
复制代码代码如下:
#parent{height:50px;overflow:hidden;}
#child a{position:relative;}
HTML代码
复制代码代码如下:
div id="parent"
div id="child"
a href="http://www.baidu.com/"百度/a
a href="http://www.jb51.net/"/a
a href="http://s.jb51.net/"服务器/a
a href="http://tools.jb51.net"查询工具/a
a href="http://www.jb51.net/softs"软件下载/a
a href="http://www.jb51.net/codes"源码下载/a
/div
/div
我们在IE 6内发现子元素会超出父元素设定的高度,即使父元素设置了overflow:hidden。
解决这个bug很简单,在父元素中使用position:relative;即可解决该bug
即css
复制代码代码如下:
#parent{height:50px;overflow:hidden;position:relative;}
#child a{position:relative;}
当父元素的直接子元素或者下级子元素的样式拥有position:relative属性时,父元素的overflow:hidden属性就会失效。
CSS代码
复制代码代码如下:
#parent{height:50px;overflow:hidden;}
#child a{position:relative;}
HTML代码
复制代码代码如下:
div id="parent"
div id="child"
a href="http://www.baidu.com/"百度/a
a href="http://www.jb51.net/"/a
a href="http://s.jb51.net/"服务器/a
a href="http://tools.jb51.net"查询工具/a
a href="http://www.jb51.net/softs"软件下载/a
a href="http://www.jb51.net/codes"源码下载/a
/div
/div
我们在IE 6内发现子元素会超出父元素设定的高度,即使父元素设置了overflow:hidden。
解决这个bug很简单,在父元素中使用position:relative;即可解决该bug
即css
复制代码代码如下:
#parent{height:50px;overflow:hidden;position:relative;}
#child a{position:relative;}
展开全文阅读
相关内容
-
IE overflow:hidden失效的解决方法
IE overflow:hidden失效的解决方法,失效,显示,属性,解决方法,...
-
JS实现设置ff与ie元素绝对位置的方法
JS实现设置ff与ie元素绝对位置的方法,元素,位置,方法,设置,窗...
-
IE浏览器专有css属性之zoom详解
IE浏览器专有css属性之zoom详解,属性,浏览器,对象,元素,浮动,...
-
让IE6支持HTML5元素的方法
让IE6支持HTML5元素的方法,方法,元素,支持,文件,网站,脚本,前...
-
ie 7/8不支持trim的属性的解决方案
ie 7/8不支持trim的属性的解决方案,方法,复制,浏览器,属性,解...
-
IE6图片元素img下出现多余空白的问题
IE6图片元素img下出现多余空白的问题,元素,方法,解决方法,对...
-
浅析IE10兼容性问题(frameset的cols属性)
浅析IE10兼容性问题(frameset的cols属性),属性,兼容性问题,浏...
-
div层调整z-index属性在IE中无效原因分析及解决
div层调整z-index属性在IE中无效原因分析及解决方法,无效,原...
-
IE7.0以下版本列表li中的元素错位一个上一个下
IE7.0以下版本列表li中的元素错位一个上一个下的解决方法,元...
-
如何解决IE6/IE7不识别display:inline-block属
如何解决IE6/IE7不识别display:inline-block属性,识别,属性,...
-
IE 6不支持min-height或max-width等属性的完美
IE 6不支持min-height或max-width等属性的完美解决方案,完美,...
-
IE6不兼容position:fixed属性的解决办法分享
IE6不兼容position:fixed属性的解决办法分享,属性,位置,模拟,...
-
css padding属性兼容ie6,ie8,firefox实例详解
css padding属性兼容ie6,ie8,firefox实例详解,属性,兼容,边距...
-
ie placeholder属性的兼容性问题解决方法
ie placeholder属性的兼容性问题解决方法,解决方法,属性,失去...
-
ie8下不解析background属性与书写格式有关
ie8下不解析background属性与书写格式有关,格式,属性,解析,属...