當元素設置浮動(float)後會被移出文檔流,相信大家都會經常遇到這樣的問題。
這問題的解決辦法有N種之多,因為每種浏覽器對CSS的解析各異,所以在不同浏覽器使用清除浮動的元素也會有所不同。
我認為目前還沒有最好的清除浮動元素或組合,而是根據情況分析而選擇,最好的清除浮動元素或組合。
為了兼容不同浏覽器,可能要使用不同的清除浮動元素組合使用,如:{overflow:hidden; zoom:1;}、{display:table; width:100%;}、{overflow:hidden; height:1%;}
以下分析了部份的消除浮動元素對浏覽器的支持:
運行代碼框
[Ctrl+A 全部選擇 提示:你可先修改部分代碼,再按運行]
注意:以上表格元素是指,當內容被移出文檔流時清除元素對浏覽器分支持
你是否也使用了以上表格元素或組合,如有更佳的消除浮動元素或方法,歡迎賜教!