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