一般來說衍锚,想讓一個DIV盒子的高度能夠根據(jù)盒子內(nèi)的內(nèi)容自動調(diào)整褂微,不設(shè)置盒子的高度值(height)就行了功蜓。
但還有一種情況:為了使盒子布局美觀,需要對盒子設(shè)置一個初始高度宠蚂,當(dāng)盒子中的內(nèi)容很少時式撼,保持這個初始高度,如果內(nèi)容超過該盒子初始高度的容量求厕,則盒子的高度根據(jù)內(nèi)容自動調(diào)整增高著隆。所以這時需要設(shè)置一個具體的DIV盒子高度值,又要使其能夠在超過初始高度時自適應(yīng)呀癣。
具體解決辦法是(假設(shè)DIV盒子的初始高度是500px):
#columnMain{
min-height:500px;
height:auto !important;
height:500px;
}
這里美浦,height:500px;適用于IE6,因為IE6不認(rèn)識前兩條CSS語句项栏,但height:500px;對IE6足夠了抵代,因為IE6的渲染辦法是當(dāng)已設(shè)置的實際高度不夠用時,會自動撐開盒子的高度忘嫉;前兩條CSS語句min-height:500px;height:auto !important;是對IE7+、Chrome案腺、FF和Oprea用的庆冕,這些版本的瀏覽器使用min-height:500px;設(shè)置了最小高度,如果超過了最小高度劈榨,則使用height:auto !important;自動調(diào)整高度访递,注意這條CSS語句中有!important,所以它的優(yōu)先性是超過其后的height:500px;的同辣。
至此拷姿,問題解決。