［CSS覚書］clearfix設定復習分

2010年5月12日2012年11月27日

だいぶ前に作ったのの見直す機会があり、
clearfixの設定が入ってないところがあったので、
復習がてら載せます。

divパーツのclass要素にcleafixを設定するやり方

clearfixでfloatを解除 | d-spica

.clearfix:after {
  content: ".";  /* 新しい要素を作る */
  display: block;  /* ブロックレベル要素に */
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}

* html .clearfix {
  height: 1px;
  /*¥*//*/
  height: auto;
  overflow: hidden;
  /**/
}

classパーツにcleafix設定を追加するやり方

小粋空間: CSS の after 擬似要素で回り込みを解除する

.fbox {
    zoom: 100%;
}

.fbox:after {
    content: "";
    clear: both;
    height: 0;
    display: block;
    visibility: hidden;
}