在使用div+css進行網頁佈局時，如果外部div有背景顏色或者邊框，而不設置其高度，在IE瀏覽器下顯示正常。但是使用Firefox/opera瀏覽時卻出現最外層Div的背景顏色和邊框不起作用的問題。
大體結構
<div class="outer">
</div>
css文件:（只寫出了最主要的部分css代碼：定義了最外層div的背景顏色和邊框，同時定義了裏面的div是浮動的）
.outer{border:#F00 1px solid; background:#FF9 repeat;}
.inner1,.inner2{float:left;}
在IE中顯示正常，如圖1
（圖1）
在FF中顯示不正常，邊框線和背景色都不能正常顯示，如圖2
（圖2）
從網上查閱了一些資料，纔對這個問題有了大體的認識。
原因分析：由於在Firefox和opera中：如果裏面的DIV是浮動的（float）而母體不會去計算子體float之後的height。而在 IE中支持這種計算，所以IE下正常。
所以出現這種問題有兩個前提：1.外部div沒有設置高度；2. 內部div是浮動的（帶有float屬性）。
解決方法：
給外部div直接設置高度（不推薦），因爲很多時候我們並不知道外部div的高度，我們希望靠裏面的div來根據內容自動抻開外邊的div，除非你確定的知道外部的div的高度的情況下，所以不建議使用這種方法。
方法一：
在內部每個div後加一個清除浮動（推薦），這樣firefox和opera就把裏面不當成浮動，會自動計算內部div高度
<div class="outer">
</div>
方法二：
在.outer中加一句overflow:hidden;(這種方法我不是特別理解，但是經過試驗，也是可以解決這個問題的
)
overflow 屬性規定當內容溢出元素框時發生的事情。如果外層設置了高度，並且高度小於內層佔的實際高度，則內層一部分內容會被隱藏。