【IE overflow:hidden失效的解決方法】overflow:hidden失效
當父元素的直接子元素或者下級子元素的樣式擁有position:relative屬性時，父元素的overflow:hidden屬性就會失效 。
我們在IE 6內(nèi)發(fā)現(xiàn)子元素會超出父元素設(shè)定的高度，即使父元素設(shè)置了overflow:hidden 。
解決這個bug很簡單，在父元素中使用position:relative;即可解決該bug
我的辦法：子元素設(shè)置絕對定位，父元素相對定位，這樣overflow:hidden就不會失效了 。
IE下CSS溢出隱藏失敗(IE overflow:hidden失效)
復(fù)制代碼代碼如下:
div id="slides-pic"
div
p class="hot"
a class="hot-2" target="_blank"img src="/images/defaultpic.gif" //a/p
p class="main" a target="_blank"img src="/images/defaultpic.gif" //a/p
/div
div
a target="_blank"
img src="/images/defaultpic.gif" /
/a
/div
div
a target="_blank"
img src="/images/defaultpic.gif" /
/a
/div
div
p class="hot" a class="hot-1" style="clear:both" href=""img src="/images/defaultpic.gif" //a
a class="hot-2" href=""img src="/images/defaultpic.gif" //a/p
p class="main" a href=""img src="/images/defaultpic.gif" //a/p
/div
/div
kaluli新版首頁的slide項目中出現(xiàn)了一個問題，在FireFox下顯示正常，但是在IE下所有圖片都顯示出來，不能實現(xiàn)溢出隱藏 。后來搜到是 div id=slides-pic的子節(jié)點div的問題，這個節(jié)點中使用了position:relative造成顯示異常，解決辦法是在父節(jié)點容器 中也加一個position:relative 。
position的相對和絕對應(yīng)一起搭配起來才比較合適，不然會出現(xiàn)莫名其妙的問題 。另：position和float在IE6下是無法一起使用的，所以有時候會hidden失效 。
推薦閱讀
- 詳細分析 ie7下z-index失效問題解決方法
- ie6不兼容hover ie6 a hover屬性失效解決辦法
- IE6 Bug overflow:hidden失效
- select選項過長無法顯示設(shè)置overflow：hidden在IE9中不起作用
- IE8/9 使用text-overflow: ellipsis 做塊元素超長內(nèi)容變省略號的問題
- ie,360下html錨點失效問題解決
- window.location.href IE下跳轉(zhuǎn)失效的解決方法
- 民間借款借條多久失效
- 修正IE下使用CSS屬性overflow的bug
- overflow:hidden 解決IE6,IE7不能隱藏絕對定位溢出的內(nèi)容