« 2冊の本 | HOME | 年中無休ではなくて »
2008年12月11日 | カテゴリー: コンピュータを活かす
IE6でfloatした時に余計な・・・
左上はDVD視聴中・・・
（画像をクリックすると大きく表示されます）
今更ながらIE6には悩まされます。
いつものようにFirefoxで作ってIE7もオーケー。
で
DVD見ながら遊び半分にIE6チェックしたら
漆黒の中に浮かぶまるでまぼろしのような文字。
最後の文字が自動的に複製されて、よそにはみ出して表示されてる。
これは便利な仕様
じゃなくって
続き見られない！
マジメに探したら原因が分かりました。
IE6にはfloat指定すると3pxの隙間が出来てしまうバグ。
そのバグを無視して、2段組のカラムの幅の合計を親カラムと同じにしていたため。
簡単に書くとHTMLとCSSは下のような感じ。
HTML
< body>
< div id="container">
< div id="main">メインコンテンツ< /div>
< div id="menu">メニュー< /div>
< /div>
< /body>
CSS
#container {width: 760px}
#main {float: right; width: 580px}
#menu {float: left; width: 180px}
幅580pxだったメインカラムを-3pxの577pxに変更してクリア。
この間とは違って解決！
ちなみに
"IE6 バグ 最後の文字"なんかで検索すると
HTMLにあるコメントが原因みたいなことも書いてあったりしますが・・・
本日のキーワードはこちら
IE6バグ まぼろし« 2冊の本 | HOME | 年中無休ではなくて »
投稿者 WADA : 2008年12月11日 20:12