ページ全体をセンタリングできません

質問

フルCSSでWEB作成をしていますが、ページ全体をセンタリングしたいのですが、IEで見ると右にずれてしまいます。ネットでいろいろ検索をして試してみたのですが、うまく行きません。
HTMLは
<div id="centering">
<div id="wrapper">
</div>
</div>
で、CSSは
#centering {
text-align: center;
width: 100%;
position: absolute;
margin: 0px;
padding: 0px;
}
#wrapper {
width: 900px;
margin: 0px auto 0px auto;
padding: 0px;
text-align: left;
です。
これではだめなんでしょうか。

回答No.2

abril · ベストアンサー

#wrapperのブロックが質問者様仰るところの「ページ全体（実質のコンテンツ部分）」ですよね？であれば少なくとも現在のプロパティの設定を見る限りでは、#centeringという親要素自体が不要であり、#centeringのプロパティを追加でbodyに直接定義してやれば済みますが？

body {
text-align: center;
margin: 0px;
padding: 0px;
}
#wrapper {
width: 900px;
margin: 0px auto;←上と下、右と左、の値が同じ場合はこの様に”上下”と”左右”で一括できます
padding: 0px;←bodyで初期化しているので削除しても支障なし
text-align: left;
}

という様に。"width: 100%;"と"position: absolute;"は明らかに不要です。何故不要なのかは説明を省きます。

お礼

ほんとですね…このほうがいいですね
本当にありがとうございました。

回答No.1

noname#66720

センタリングの指定自体は問題ないと思いますが、position:absolute;が怪しいです。

お礼

すみません。アドバイスどおりにきちんとやったらできました。ありがとうございました。

補足

position:absolute;を削除してみましたが、変わりません。何が行けないんでしょうか…。