CSS 對於 Float 的 clear:both 無效的解法 - 2010

2008 年寫得: 修正 CSS 對於 float 區塊, 使用 clear:both 無效的解法, 目前為止是沒有遇到什麼問題.

不過, 在今年看到此篇: Best Cross-browser CSS Clearfix solution, 跟上述那篇比對起來, 參數多增加了幾個, 到底有何差異, 就不細究了~ 直接用就對了. XD

CSS .clearfix 寫法 (摘錄自上述: Best Cross-browser CSS Clearfix solution)


.clearfix:after {
   content: ".";
   display: block;
   clear: both;
   visibility: hidden;
   line-height: 0;
   height: 0;
}
 
.clearfix {
   display: inline-block;
}
 
html[xmlns] .clearfix {
   display: block;
}
 
* html .clearfix {
   height: 1%;
   overflow: visible;
}