フロートボックスを水平方向に並べたとき、マージンが２倍に計算される//IE6のバグ対応

floatを指定したボックスに、マージンも合わせて指定すると、




IE6では、floatプロパティを指定した方向と同方向のマージンが２倍になって計算されてしまいます。









これは、並べたフロートボックスの、先頭に位置するボックスのみ、



マージンが２倍に計算されるというIE6特有のバグです。





このバグのために、正しくXHTMLやCSSを書いているのに、


IE6で表示してみたらレイアウトが崩れまくっていた、ということが起こってしまいます。





CSSでレイアウトをしはじめたとき、


誰もが必ずぶつかる現象だと思います。









これは、IE6対策として、必ず使う回避テクニックなので、必ず覚えておきましょう。









side{




float: left;




widht: 200px;




display: inline; /* for IE6 */　　　　←これを追加します。




margin-left: 20px;




}









↓　よろしかったら、ペタしてください。