只能設(shè)置父元素的padding-top;來達到效果 ??聪旅娴难菔敬a;
今天有時間,所以特意做了一個測試 。
復(fù)制代碼代碼如下:
style type="text/css"
.test-1,.test-2{border:5px solid #F00;}
.test-1{border-color:#000;}
/*width:100%; height:auto !important;height:1%; zoom:1;*/
.test-2{margin:10px;height:50px;width:500px;}
/style
div class="test-1"
div class="test-2"
test-2
/div
/div


呵呵,我標題沒錯吧 。果然IE6,IE7的margin:10px; 失效了 。
解決辦法
復(fù)制代碼代碼如下:
.test-1{border-color:#000;width:100%; height:auto !important;height:1%; zoom:1;}
使用:width:100%;或者 height:auto !important;height:1%; 或者zoom:1; 都可以解決上面的問題 。(3選1,不要全部寫進去 。)
根據(jù)自己的具體情況來選擇一種即可!
問題根源
當然知道了解決辦法還不夠,我們必須知道什么情況會引發(fā)上面的BUG,zoom:1;這東西貌似經(jīng)常使用 。于是我去查詢了一下關(guān)于zoom的一些信息 。
發(fā)現(xiàn)他會觸發(fā)IE的 haslayout; haslayout來解決一些常見的IE BUG;(建議不太明白 haslayout的同學(xué)點擊連接去讀一下 。haslayout不神秘 。)
在InternetExplorer中,一個元素要么自己對自身的內(nèi)容進行計算大小和組織,要么依賴于父元素來計算尺寸和組織內(nèi)容
上面這句加粗的話很重要哦 。
上面的例子 test-1 沒有觸發(fā) haslayout他不能負責(zé)對自己和可能的子孫元素進行尺寸計算和定位;所以子元素的margin失效 。
當然 激活 haslayout的方式很多 zoom:1; 其實設(shè)置 widht height 也可以激活 。所以當設(shè)置了 這兩個值 。子元素定位也正確了 。
以上僅個人根據(jù)網(wǎng)上的資料得到的結(jié)論,如果有錯誤,還請高人指點 。
【IE6,IE7瀏覽器下 margin 無效的解決方法】罪惡的IE 瀏覽器何時退出舞臺 。
推薦閱讀
- IE瀏覽器要合理設(shè)置Cookies
- 重裝windowsXP系統(tǒng)中IE瀏覽器2步搞定
- 如何解決IE6/IE7不識別display:inline-block屬性
- IE6不兼容position:fixed屬性的解決辦法分享
- win8系統(tǒng)中運行Metro界面IE 跳到桌面版IE瀏覽器解決方法
- Win10 Edge瀏覽器太不能獨立運行太依賴IE11該怎么辦?關(guān)閉兼容性列表就搞定
- 簡單幾步解決電腦打開ie瀏覽器網(wǎng)頁顯示白屏問題
- 讓IE瀏覽器擁有快速打開不帶鏈接網(wǎng)址的功能
- 修改IE瀏覽器參數(shù) 增強上網(wǎng)安全性
- 重裝XP系統(tǒng)后使IE瀏覽器恢復(fù)正常的方法
