clearfix
1pt
親box内の要素をすべてFloatすると、親boxのheightが0(みたい)になる現象が起きる。
clearfix(正式に名前は定義されていないが・・・)を用いると、それを防ぐことができる。つまり、どんなにfloatしまくっても、親boxはちゃんとheightをキープするっつーことっすね。
まぁ、こんな感じの定義。
/* clearfix */ .clearfix{ zoom:1;/*for IE 5.5-7*/ } .clearfix:after{/*for modern browser*/ content:"."; display: block; height:0px; clear:both; visibility:hidden; } * html .clearfix{ display:inline-table; /*\*/display:block;/**/ }
これめっちゃ便利やな~。
今まで親ボックス内の最後で<br>とか<hr>とかでclearしてまひた。
そんな非論理的なこと、もうしなくて済むよ!!
あなたにとって「clearfix」とは?
お気に入りの説明
0 pt
最近のブラウザだったらこれでいいらしい! element{ /zoom : 1; }
element:after{ content : ''; display : block;
clear : both; } http://www.yomotsu.net/wp/?p=561 float したボックス...
もっと読む
コメントはまだありません