Css浮動元素外層容器高度為0(無高度)的解決方法
發(fā)布時間：2013-07-31 11:40:11 作者：佚名 
我要評論
我要評論在ie8、chrome瀏覽器中，包裹浮動的li元素的外層ul高度為0，ie7瀏覽器和ie8兼容模式顯示正常，下面與大家分享下多種解決方法大家可以根據(jù)情況自由選擇，希望對大家有所幫助
由于項(xiàng)目中使用ul+li的布局方式，在ie8、chrome瀏覽器中，包裹浮動的li元素的外層ul高度為0，ie7瀏覽器和ie8兼容模式顯示正常，這是典型的瀏覽器兼容性問題。
解決辦法：
第一種：設(shè)置ul的style屬性
overflow:hidden;//超出元素緯度范圍的內(nèi)容的可見性：隱藏
第二種：設(shè)置ul的style屬性
float:left; //浮動：左
第三種：在ul標(biāo)記內(nèi)加空div
<div style=" clear:both; visibility:hidden;">
解決辦法：
第一種：設(shè)置ul的style屬性
復(fù)制代碼
代碼如下:overflow:hidden;//超出元素緯度范圍的內(nèi)容的可見性：隱藏
第二種：設(shè)置ul的style屬性
復(fù)制代碼
代碼如下:float:left; //浮動：左
第三種：在ul標(biāo)記內(nèi)加空div
復(fù)制代碼
代碼如下:<div style=" clear:both; visibility:hidden;">
相關(guān)文章
- 當(dāng)一個元素只包含浮動元素的時候，它會出現(xiàn)高度折疊，即元素的上下底邊重合，和高度為0效果一樣，針對這個問題與大家分享四種解決方法，感興趣的你可以參考下本文或許對你2013-03-04
- 剛?cè)腴T網(wǎng)站設(shè)計布局的開發(fā)者肯定會碰到這樣的問題，那就是當(dāng)子容器全部浮動的時候，父容器的高度不能自動撐開,今天偶也遇此問題，需要了解的朋友可以參考下2012-12-27
純CSS無hacks的跨游覽器自適應(yīng)高度多列布局 推薦
翻譯自Matthew James Taylor的Equal Height Columns with Cross-Browser CSS and No Hacks，有些部分根據(jù)我的理解改了，讓一些初心者更好理解。2009-11-12- 由于浮動的元素脫離了文檔流，所以它們不會在網(wǎng)頁文檔中占據(jù)空間。如果一個DIV容器中想要包含這些浮動的元素的話，有兩種辦法。2011-08-02
CSS教程：div設(shè)置float后高度不自動增加-CSS教程-網(wǎng)頁制作-網(wǎng)頁教學(xué)網(wǎng)
相關(guān)文章：http://www.webjx.com/css/divcss-4952.html http://www.webjx.com/css/divcss-5991.html 本來想把這個題目修改為“閉合浮動元素”或&l2008-10-17- 在進(jìn)行浮動布局時，大多數(shù)人都深知，在必要的地方進(jìn)行浮動清理：。2009-09-03
- 在網(wǎng)頁制作中經(jīng)常會用到浮動。用了浮動就會涉及到一個清除浮動的問題，因?yàn)榘拥脑厥遣粫詣舆m應(yīng)高度的，也就是不會被浮動元素?fù)伍_。2010-07-23