CSS 画像中央そろえ

質問

スタイルシートを利用して、以下のことを実現させたいのですができません。
解決方法を探しています。

■症状
ページ全体は左寄せ
ページの中身は画像単体だったり、表があったりします。
画像は中央寄せ、表も中央寄せ、表の中身（テキスト）は左寄せにしたいのですが
以下の環境下でページ中身が左寄せになってしまいます。
　⇒Mac：IE

■CSSソース
#box{　←ページ全体
width:760px;
margin: 0px;
text-align:center;
}

.box-center {　←ページ中身
text-align:center;
margin:0px auto;
padding:0;
}

.box-red {　←ページ中身の表（外枠）
background-color:#FF0000;
padding:5px;
margin:0px auto 20px auto;
}

.box-yellow {　←ページ中身の表（内側）
background-color:#FFF299;
line-height:150%;
text-align:left;
}

■HTMLソース（抜粋）
<div id="box">
　<div class="box-center">
　　<img src="～">
　　<div class="box-red">
　　　<div class="box-yellow">～</div>
　　</div>
　</div>
</div>

お分かりになる方、いらっしゃいませんでしょうか？
よろしくお願いします。

回答No.1

fairy_tink · ベストアンサー

ちょっと見ただけなので的を得ているかどうかですが、
画像を中央にしたいのであれば、cssでサイズを
指定しないとmarginの左右auto は効きません。

.box-center

の中でwidthをイメージのサイズでいれればいいと思います。

お礼

早速のご回答、ありがとうございます。
試してみます。