Fire foxで2カラム表示が乱れる

2006/01/31 17:25

このQ&Aのポイント

Fire foxで表示が乱れる問題が発生しています。具体的には、メニュー（左側）の横にメイン（右側）が並ぶべき場所に回り込んでしまっています。
問題の原因はfloatの設定にある可能性がありますが、詳細は分かりません。
現在会社のサイトのコーディング中で、IEでは表示に問題がないため、Fire foxだけで起きている問題です。お早めにご教授いただけると助かります。

raichioisi
お礼率85% (205/241)

HTML
回答数1
ありがとう数1

みんなの回答 （1）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

seaw
ベストアンサー率43% (10/23)

2006/01/31 18:08 回答No.1

一応Win版IE6、Mozilla Firefox1.5、Opera8.5で動作確認しました。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="ja" dir="ltr"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Style-Type" content="text/css"> <style type="text/css"> body { background-color: #ffffff; color: #000000; } #layout{ margin:0px; padding:0px; width:762px; text-align:left; background-color:#fff; border-right:1px solid #ccc; border-left:1px solid #ccc; } #header{ margin:0px; padding:0px; } #contents{ margin:0px; padding:0px; width:760px; } #menu{ margin:0px; padding:0px; width:190px; line-height:1.5em; float:left; background-color:#f4f4f4; border-right:1px dotted #ccc; border-left:1px dotted #ccc; border-bottom:1px dotted #ccc; } #mein{ margin:0px; padding:15px; width:550px; _margin-right: -15px; /* Win版IE6のみこの値を読み込ませる[ CSSハック : 参考 - http://www6.plala.or.jp/go_west/nextcss/tip/tech/css_hack.htm ] */ margin-left: 190px; } #footer{ margin:0px; padding-left:195px; width:760px; clear:both; border-top:1px dotted #ccc; line-height:1.3em; } </style> <title>サンプル</title> </head> <body> <div id="layout"> <div id="header">ヘッダー</div> <div id="contents"> <div id="menu">メニュー（左側）</div> <div id="mein">メイン（右側）</div> </div> <div id="footer">フッター</div> </div> </body> </html>

質問者