IE6のfloatしたボックスのmarginの値が2倍になるバグ対策の件

IE6で、floatで指定した値と同じ方向にmarginの指定をすると、指定値の倍程度になってしまうっていう有名なバグ。

その対策として、marginの代わりにpaddingを使うとか、親要素でpaddingを取るとかあったりしますけど、一番手っ取り早い感じで、問題が無さそうなdisplay: inline;を指定する方法がありますよね。えぇ。

何となく他のブラウザに影響ないの！？って思ってしまうかもですが、
こういう矛盾しちゃいそうな指定がされた時はどーしたらええの？っていうのがちゃんと仕様で決まってるので仕様通りに動いてくれるブラウザさんなら問題ないわけです。

そうなんですよ。仕様通りにね、動いてくれるブラウザさんならね。

---- こっから続き

仕様通りに...

そこで登場するのが、IE7。
IE6に比べればだいぶ良くなったもののやっぱり色々問題があるIE7。

そんなIE7さん、こんなトコロにも影響があったりするんです。

IE6のバグ対策の為に指定したdisplay: inline;が影響して、レイアウトが崩れる。
でもこの発生条件が、イマイチ分かってない、、、

サンプルが作れればよかったんですが、肝心の発生条件覚えてません。

使えない情報ですんません。
ただ、float指定してる子要素にposition指定とかあったりなんやかんやと色々やってる時に発生したような記憶があるので、そんな時は要注意です。

paddingでいけるときはpaddingにしたり、IE6用のハックとか使って指定しておくのが良さげですって事で。

そういえばチョット前に書いた、タイピングのエントリーですけど、200人近くの人が登録してくれてびっくり！

ボクの速さのほどはどうでも良いとして、
1位の人（デジパの中の人）がちょっと調子乗ってるので、誰か蹴落として下さい！
世の中の厳しさを！！

各種SBMに追加

• 
• 
• 
• 
• 
• 
•