2005.11.18

[ float:left ][ clear:both ] と親となるボックスとの関係

ボックスの回り込みを解除する [ clear:both ] ですが、親となるボックスに指定したスタイルにも大きく関係しています。

四方枠線が濃い茶、背景色がベージュのボックスを用意します。


sample1
上記ボックスを親として、中に[ float:left ]の指定をしたボックスを2個入れます。
親ボックスの枠線、背景色は中に入れた2個のボックスには継承されません。

sample1.gif


sample2
上記ボックスを親として、中に[ float:left ]の指定をしたボックスを2個入れます。
その下に[ clear:both ]を指定したボックスで閉じてやれば親ボックスの枠線、背景色は継承されます。中身の無いカラのボックスでもかまいません。

sample2.gif

ところでMovableType の管理画面が最近リニューアルされましたが、NN for Mac でエントリーの「保存」「確認」ボタンが表示されなくなりました。表示文字は小さくなるし困ったものです。

トラックバック

このエントリーのトラックバックURL:
http://www.ilovex.co.jp/scripts/intra/mt/mt-tb.cgi/806

photo
hashimoto