ホームページ制作 iDesignブログ > WEB > ie6でテキストが複製されboxからはみ出るバグ

ie6でテキストが複製されboxからはみ出るバグ

ホームページ表示のブラウザチェックをしていたところie6でテキストが複製され、boxからはみ出てしまう事態に遭遇。

ie6以外では正常に表示されているので、もちろんソースを見ても余分な記述はない。

ie6でテキストが複製されてしまった。

boxを入れ子にしてfloatさせている部分で横幅はきっちりの数字。

でも、こういったレイアウトはie6には注意が必要ですね。

CSSを変更してもダメ。

いろいろと調べてみたところ、ie6では、floatさせたボックスとボックスの間に(終了タグの直後)コメントアウトがあると表示が崩れることがあるようです。

複製されてしまっているテキスト回りのコメントアウト部分をひとつづつ消去しながら確認。

</div><!--box01-->←この部分を削除

見事、複製されたテキストは消え、正常な表示に戻りました。

しかし、ボックスの入れ子の場合、できればわかりやすく終了タグにコメントをつけておきたいと思い、終了タグの直後ではなく直前にコメントをつけてみた。

<!--box01--></div>

これならコメントアウトしても正常に表示されるようです。

コーディング時のie6対策の基本としてコメントアウトは全て終了タグの直前につけるように決めておくといいですね。

ie6でテキストが複製されboxからはみ出るバグを最後までお読下さいましてありがとうございます。
Yahoo!ブックマークに登録 Yahoo!ブックマークに登録  ブックマークに追加する

プロフィール

愛知県名古屋市ホームページ制作 アイデザイン

アイデザインは愛知県名古屋市を拠点としたSOHO(個人事業)によるホームページ制作サービスです。 低価格でも高品質、初心者でも更新しやすく、効果の上がるホームページ作成をモットーに制作しています。

新着記事

カテゴリー


 RSSリーダーで購読する

ブックマークに追加する