CSS: 2007年10月アーカイブ

Microsoft謹製のIE用ツールバー（Web開発者向け）です。

CSSレイアウトの検証用に便利。

http://www.microsoft.com/downloads/details.aspx?familyid=e59c3964-672d-4511-bb3e-2d5e1db91038&displaylang=en

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;
}
/**/

ソース部分のみインデントさせようと思ったのだが、編集画面の「テキストインデント」は、単に「BLOCKQUOTE」タグを使用するものだった。

のみならず、入れ子構造に無理があるのか、レイアウトが壊れた・・・。

仕方が無いのでインデントを解除することにした。

む～ん。