以下的內容是一位網友的DIV CSS編碼筆記,是值得大家學習的,在實際工作與開發中,將工作中的點滴記錄下來,回首這些過往,你也會收獲很多,如果能在webjx.com與大家共同交流,相信進步就更快了。大家一起努力!
最近在做一個魔術網的div+CSS切割,昨晚發現了長期以來一直無記錄下來的問題!關於兼容IE跟FF的float屬性。趁現在還清醒趕緊記下筆記先:
一、並排在一行的兩個div樣式有這種情況:IE或者ff下對於子div設置float左的時候,如果另外的子div沒有設置float左的話,兩個浏覽器下會有區別,具體有一個會產生間隙。兼容做法就是都設置float屬性。但是記住有設置過float就要將float clear掉,不然下面的div會疊在已float的div上。我通常把清除浮動寫成單獨的<div class=”clear”></div>放在所有浮動div的最下方。
二、在上述1情況中需要設置子div的寬度,假如不設置的話子div的寬度會被默認為母div的100%,這樣float根本就產生不了效果。當然還可以用display:inline的方法讓兩個子div並排,但是這樣的話div的寬度設置將會失效(要把子div撐大只能考裡面的元素)。
三、ie中母div被設置成特定高度之後,假如裡面的子div高度(有float的話就以清除float的div的最底為總高度)超過了母div設置的高度,IE會自動把母div撐大,但是ff卻不能,ff中母div的高度會依然,裡面的子層會溢出到外面來。兼容方法:不要設置母層高度。