common.cssという外部CSSファイルで .main{ width:800px; margin:0 auto; } としています。 HTMLを簡単に書くと test ここに中央寄せになった記述としています。 firefoxでは中央寄せになりますが、IE8では中央によりません。どのようにしたら良いでしょうか？

IEでCSSの中央寄せが効かない

解決済

質問者：eccschool
質問日時：2009/08/25 21:04
回答数：3件

common.cssという外部CSSファイルで
.main{
width:800px;
margin:0 auto;
}
としています。
HTMLを簡単に書くと
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" >
<title>test</title>
<meta content="text/javascript" http-equiv="Content-Script-Type">
<link media="all" type="text/css" rel="stylesheet" href="css/common.css">
</head>
<body>
<div class="main">
ここに中央寄せになった記述
</div>
</body>
</html>
としています。
firefoxでは中央寄せになりますが、IE8では中央によりません。
どのようにしたら良いでしょうか？

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (3件)

ベストアンサー優先
最新から表示
回答順に表示

No.2ベストアンサー

回答者： abril
回答日時：2009/08/25 21:37

手元にIE8がないので実際の検証はできませんが、IE8にはDOCTYPE スイッチとはまた異なる3種類のモード・スイッチが存在する様です。

【参考】http://standards.mitsue.co.jp/archives/001326.html

上記から引用ここから---------------------------------------------------------------------------
IE8には3つのレンダリングモードが存在します。

IE8モード
　CSS 2.1やSelectors APIなど、Web標準を強く意識したモード。
IE7モード
　IE7の標準準拠モードと同じ
IE5モード
　IE7やIE6の互換モードと同じ
上記から引用ここまで---------------------------------------------------------------------------

で、更に下記のコンテンツには、どの様な条件下でどの様なモードになるか、の検証結果が一覧になっています。
【参考】http://hxxk.jp/2008/09/29/0118#sub-20080929-06
上記の「DOCTYPE スイッチの一覧表」という項目を見て下さい。この検証結果に依ると、質問者様のHTMLは
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
ですから、この場合、IE8は「IE5モード」になっている事になります。上記の引用に説明があります通り、IE5モードというのはIE7やIE6の「後方互換モード」と同じ挙動をします。
この「IE7やIE6の後方互換モード」においては、CSSの本来の仕様に準拠しない表示が数多く出てきてしまいます。例えば、”margin: auto;”が無効になるのもその一つです（その他にも沢山やっかいなバグが…下記をご覧になってみて下さい）。
【参考】http://spreadsheets.google.com/pub?key=pbrvd2wQK …

つまり、現在の質問者様の検証環境では”margin: auto;”が効いていない事になりますので、当然「中央寄せ」にはなりません。
DOCTYPEを変えられる様なら、（IE8が標準準拠モードで挙動するものに）変えてしまった方が良いでしょう。変えられないのであれば、IEの後方互換モード対策として、CSSを以下の様に変更してみて下さい。

body {
text-align: center;
}
.main {
width:800px;
margin: 0 auto;
text-align: left;
}

IE6時代からよく使われる対処法の一つです。