２コラムレイアウトなどでfloatで左右に振る方法があるが、floatを指定した要素を包含する親要素のボックスは高さ０でレンダリングされてしまう。
これを解決する方法として、<br />タグにclear属性を指定して強制的にfloatを解除したりしていたが、この空要素は正当でなく、無い方が好ましい。
で、別な方法があの雑誌に載ってました。WEB雑誌は押し並べてFLASHサイトばかりに注目するので FLASH DESIGNING とか FLASH CREATORS とかにしたらどうかと思うけど（そういう僕も凄いと思うサイトは激しく FLASH だったりするが）、結構良い記事書いてます。
その方法は、floatを指定した要素を包含する親要素にoverflow: auto;を指定すること。
“side bar” 要素と “contents” 要素にそれぞれfloat: left;とfloat: right;が指定してあり、”main” 要素がその親要素にあたる。
親要素で全体を囲うデザインの場合はこれで解決できそう。
No Comments