スタイルシートdivについて

質問

こんばんは。
スタイルシートのDIVについて教えて下さい。

今、幅720pxのテーブルをDIVに変えようと悪戦苦闘している最中です。
DIVについてはほとんど無知なので、あちこちのサイトのスタイルシート講座を覗きながらなんとか作ってみました。

ようは幅720pxのボックスの中に文字を左寄せで配置し、ボックス自体は画面の中央に(左右のマージンを同じに)したいのです。

そのソースなのですが、スタイルシートを
div#main{width:720px; margin-left:auto; margin-right:auto; text-align:left; line-height:175%;}
と記述し、

HTMLを
<div id="main">○○○</div>
としました。○○○がテキスト部分です。

でもIE7で確認したところ、ボックスが左寄りになってしまっています。
しかし、どういうわけかFirefoxとOperaではちゃんと中央に配置されているのです。

いったいどこに問題があるのでしょうか。
わかる方、いらっしゃいましたら教えて下さい。

回答No.2

bugtte · ベストアンサー

cssに
body{text-align:center;}
と追加してみてください。

IEだけ表示が違うのはよくあることです。
さらにIE6とIE7でも変わってくるので要注意です…

お礼

body部分にtext-align:center;を追加したところ、やっと中央に配置することができました。

> IEだけ表示が違うのはよくあることです。
やっぱりIEで見る人が一番多いと思うので、悪戦苦闘しておりました。
回答ありがとうございました。

回答No.1

se-nabe

もっと前のHTMLも見ないとわかりませんが、
予想では、
そのDIVを囲っているDIVのCSSにfloat:leftなどかかれていませんか？

marginの方法はあっていると思うので、違う場所のCSSが継承されているのだと思います。

お礼

まだ書き始めたばかりで、DIVはそれひとつだけなのです。
でも違う場所のCSSが継承されることもあるのですね。
参考になりました。
ありがとうございました。