Clearfixの話

| | コメント(0) | トラックバック(0)

http://www.fsiki.com/archive/css-doc/float.html

これはつまり、親Block要素(幅・高さ未指定の、背景表示用)内に、左右振り分けの子ブロック要素をFloatを使って配置した場合、親Block要素からは子Block要素の高さが取得できずに背景を正しく表示させることが出来ない、という問題に対する解決方法です。

親要素を ID:container としたとき、CSSに以下を追加すると解決できる、ということです。

※後半部分は、IE用のスターハックと呼ばれるCSS-hackが使われています。

 #container {
    overflow: hidden;
}

#container:after {
    content: "";
    display: block;
    clear: both;
    height: 1px;
    overflow: hidden;
}

/*\*/
* html #container {
    height: 1em;
    overflow: visible;
}
/**/

トラックバック(0)

このブログ記事を参照しているブログ一覧: Clearfixの話

このブログ記事に対するトラックバックURL: http://northernland.net/mt/mt-tb.cgi/5

コメントする

このブログ記事について

このページは、adminが2007年10月17日 17:03に書いたブログ記事です。

ひとつ前のブログ記事は「BLOCKQUOTEタグに不具合あり?」です。

次のブログ記事は「カテゴリごとの最新記事を表示する」です。

最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。

Powered by Movable Type 4.01