フロートを解除する為のClearfixの使い方と意味

CSSでFloatを使った場合、ほとんどの場合でfloatを解除する必要があります。
何年か前は解除したいところに、divタグを作って、そこにclear:both;をCSSで設定するようにしていました。
しかし、html的に不必要なDIVタグを作るのもどうか?ってことで作られた物の一つがclearfixになります。

使い方は簡単!
CSSに以下のコードを書いておいて、フロートを掛けている要素の親要素のクラス名に対して「clearfix」を追加するだけ。
そうすると、親要素が閉じる前に自動的にclearさせる要素をこっそり作って、そこでフォローを解除してくれます。

にほんブログ村 IT技術ブログへ にほんブログ村 IT技術ブログ WordPressへ にほんブログ村 IT技術ブログ Webサイト構築へ

投稿者: おーあえ

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください