DIV+CSS最小高度(兼容IE6\IE7\FF)發(fā)布者:本站 時間:2020-05-16 09:05:01
折騰了一上午,就是搞不定這個最小高度 min-height:的問題,因為min-height:只在IE7FF中起作用。至于這個IE6死活就是不認。而我這個頁面又必需得用這個最小高度來定。
頁面是二欄的左右分,左欄算是導(dǎo)航菜單固定不變,長約1160PX,右邊是產(chǎn)品的詳細信息且是動態(tài)的,可長可短。
左右欄中間是一條1PX灰色的分隔線,就是這根分隔線倒底是定在左欄的右邊框上,還是定在右欄的左邊框上,問題有點頭痛。因為左邊定死 1160PX,右邊是自由伸展。如果定在左欄上,右欄動態(tài)內(nèi)容長度大于1160時這根線是不會跟著做延伸的。那好,那就定在右欄上,但如果右欄的動態(tài)內(nèi)容 小于左欄1160時,這根線也是不會自動伸止1160處。麻煩了,真是左右為難。
現(xiàn)在只有最小高度可以解決這個問題了,把右欄定一個最小高度min-height:1160px;這樣左右就一樣了。即使右欄動態(tài)內(nèi)容不能達到 1160的長度,有了這個最小高度,右欄將始終都是以1160這個最小高度來顯示,至于動態(tài)內(nèi)容大于1160時,也是可以做自動延伸的。問題到了這一步, 也能用這方法解決了。
但頭痛的是IE6就是不認min-height:,這樣定好后在IE7FF里測試是沒有任何問題的。但我們現(xiàn)在要解決IE6的。好在IE6與 IE7不同,它可以將一個模塊定死高度,當(dāng)模板里內(nèi)容大于這個高度時,是會自動撐開這個模塊,IE7如果定死高度,內(nèi)容大于高度時是會被遮住,就是不顯 示。
利用這一點。我們就可以在代碼里設(shè)置了,具體如下:
.left{float:left;width:200px;}
.right{
float:right;
width:600px;
border-left:1px solid #ccc;
min-height:1116px; // IE7FF
height:100%; // IE6IE7FF 這個很重要,IE6定死高度后,需要再加上這條,才能自動延伸。
_height:1116px; //IE6
}
選擇我們,優(yōu)質(zhì)服務(wù),不容錯過
1. 優(yōu)秀的網(wǎng)絡(luò)資源,強大的網(wǎng)站優(yōu)化技術(shù),穩(wěn)定的網(wǎng)站和速度保證
2. 15年上海網(wǎng)站建設(shè)經(jīng)驗,優(yōu)秀的技術(shù)和設(shè)計水平,更放心
3. 全程省心服務(wù),不必擔(dān)心自己不懂網(wǎng)絡(luò),更省心。
------------------------------------------------------------
24小時聯(lián)系電話:021-58370032