IE overflow:hidden无效的处理方式

日期:2021-03-12 类型:科技新闻 

关键词:图片模板,淘宝作图用什么软件好,在线制作白底图,设计图制作软件,抠图软件

overflow:hidden无效
当父元素的立即子元素或下级子元素的款式有着position:relative特性时,父元素的overflow:hidden特性就会无效。
大家在IE 6内发现子元素会超过父元素设置的高宽比,即便父元素设定了overflow:hidden。
处理这个bug很简易,在父元素中应用position:relative;便可处理该bug

我的方法:子元素设定肯定精准定位,父元素相对性精准定位,这样overflow:hidden就不容易无效了。

IE下CSS外溢掩藏不成功(IE overflow:hidden无效)

拷贝编码
编码以下:

<div id="slides-pic">
<div>
<p class="hot" >
<a class="hot⑵" href="http://www.kaluli.com/category.php?sort=3&cat=92&category=71&display=grid&brand=0&price_min=0&price_max=0&sex=&material=&color=&pro_size=&filter_attr=&page=1" target="_blank"><img src="images/slide_2.gif" /></a></p>
<p class="main" ><a href="http://www.kaluli.com/goods9084.htm" target="_blank"><img src="images/slide_3.gif" /></a></p>
</div>
<div>
<a href="css⑴12.jpg" target="_blank">
<img src="images/slide2.jpg" title="" alt="这是第2张照片" />
</a>
</div>
<div>
<a href="css⑴12.jpg" target="_blank">
<img src="images/slide2.jpg" title="" alt="这是第2张照片" />
</a>
</div>
<div>
<p class="hot" ><a class="hot⑴" style="clear:both" href=""><img src="images/slide_1.gif" /></a>
<a class="hot⑵" href=""><img src="images/slide_2.gif" /></a></p>
<p class="main" ><a href=""><img src="images/slide_3.gif" /></a></p>
</div>
</div>

kaluli新版主页的slide新项目中出現了1个难题,在FireFox下显示信息一切正常,可是在IE下全部照片都显示信息出来,不可以完成外溢掩藏。后来搜到是 <div id=”slides-pic”>的子连接点<div>的难题,这个连接点中应用了position:relative导致显示信息出现异常,处理方法是在父连接点器皿 中也加1个position:relative。

position的相对性和肯定应1起配搭起来才较为适合,要不然会出現无缘无故的难题。另:position和float在IE6下是没法1起应用的,因此有时会hidden无效。