在使用浮動的時候經(jīng)常會遇到一個古怪的事情:
img { float: right; }
不......這個圖片比包含它的元素還高, 而且它是浮動的,于是它就溢出到了容器外面!
見證奇跡的時刻到了!有一種比較丑陋的方法可以解決這個問題,它叫做清除浮動(clearfix hack).
讓我們加入一些新的CSS樣式:
現(xiàn)在再看看發(fā)生了什么:
好多了!
這個可以在現(xiàn)代瀏覽器上工作。如果你想要支持IE6,你就需要再加入如下樣式:
有些獨特的瀏覽器需要“額外的關照”。清除浮動這譚水很深很深,但是這個簡單的解決方案已經(jīng)可以在今天所有的主要瀏覽器上工作。