时间:2021-05-08
下面就是我所收集或遇到的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="https://www.jb51.net/"></a>
<a href="http://s.jb51.net/">服务器</a>
<a href="http://tools.jb51.net">查询工具</a>
<a href="https://www.jb51.net/softs">软件下载</a>
<a href="https://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;}
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
方法一:用DIV,代码如下:(推荐此方法) 说明:上面代码中的红色部分overflow:hidden;很重要,如果不加这句的话,在IE6下高度将会被拉
今天在做网页的时候发现一个问题,在父标签中使用了overflow:hidden;时,如果子标签中有元素的position设置成relative的时候,在IE6和
overflow属性说明:版本:CSS2 兼容性:IE4+NS6+ 继承性:无语法:overflow:visible|auto|hidden|scroll相关参
非IE6下的写法大家一般都清楚如何写;这里就不展示了;切入正题,以下的IE6下CSS的兼容性写法:复制代码代码如下:html,*ht
ie6中li插入图片后下方有空隙bug,这是ie6的有一个经典bug。解决该bug有很多方法,今天我整理了下,共4种方法,给大家分享下。首先附上代码:复制代码代