IE6でfloat指定したboxの次に配置されるboxのmargin問題

CSS-MEMO

現象：IE6でfloat指定したboxの次に配置されるboxに対して、float指定が無かった場合、そのboxの左側に不明な3pxのmarginが設定される

原因:不明

回避策:float指定したboxの次に配置されるboxにもfloat指定をする

補足:IE7, firefox2.x, firefox3.xでは以上の現象は発生しない

IE6で、float指定したboxのmarginがおかしいことになるというのは有名なバグらしいが、プログラミング経験の浅い私は当然そういうことを知らなかった。

↓既知のバグ("ie6, float, margin"でgoogle検索)

http://www.google.co.jp/search?q=ie6+float+margin&lr=lang_ja&ie=utf-8&oe=utf-8&aq=t&rls=org.mozilla:ja:official&client=firefox-a

しかし、例え知っていたとしても、上記のバグには気がつかなかっただろう。

(実際に、報告されているバグの中には私がはまった現象は見あたらなかった)

新規性には欠けるが、同じはまり方をすると悪夢なので(おかげでサイアクな仕事納めになった)、念のためメモしておく。