(CSS)軽量化されたclearfix「micro clearfix hack」のデモ

いまや"float"の解除に欠かせない"clearfix"ですが、それ自体はわずか数行に収まるスタイルシートです。 それでも更にソースの軽量化を図りたい方は試してみる価値のあるハックです。スタイルの名称も、"clearfix"から"cf"にして6文字減らすなど苦心のあとが見受けられます。なお、ケースバイケースですが、更に軽量にできる場合もあります。→CSSの小技・まとめ
以前からのclearfixのソース
.clearfix:before,
.clearfix:after { content: "."; display: block;
 height: 0; overflow: hidden;}
.clearfix:after {clear: both;}
.clearfix {zoom: 1;}  /* IE < 8 */
「micro clearfix」のソース
 .cf { zoom: 1; } /* IE < 8 */
.cf:before, .cf:after { content: ""; display: table; }
.cf:after { clear: both; }
「micro clearfix」のデモ
Float
Float

引用、参考:http://nicolasgallagher.com/micro-clearfix-hack/