今天在做兩欄布局的自適應時(左邊定義寬度,高度自適應,右邊高度和寬度都自適應),左欄定義了左浮動,右欄沒有定義浮動,只是采用外補丁的左邊距來定位,以前只是知道左邊要浮動,右邊非浮動時兩個層之間就會出現(xiàn)這個3px bug,結果發(fā)現(xiàn)那個3px bug沒有出現(xiàn)(這時右欄沒有定義寬度),所以就調試了調試,看看哪種情況下3px的bug會出現(xiàn),便有了以下結論:
產生條件:當一個浮動元素相鄰的非浮動元素沒有指定具體的高度或者寬度時,非浮動元素中的內容會和浮動元素的邊界產生3px的空隙,這個空隙只沿著浮動元素顯示,當浮動終止時,文本就恢復正常了,如果非浮動元素指定具體的寬度或者高度,這個時候非浮動元素和浮動元素就出現(xiàn)了3px的空隙
更多信息請查看IT技術專欄