[CSS] floatを解除する「clearfix」

CSSにて、floatを解除する「clearfix」のサンプルコードをメモ。

/* new clearfix */
.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
  }
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

以上です。

【参考】

・[CSS]floatを解除する「clearfix」のIE6/7に対応した改良版 | コリス

現場のプロから学ぶXHTML+CSS

posted with ヨメレバ

益子貴寛毎日コミュニケーションズ 2008-11-11