tableの中の画像のセンタリング

質問

tableの中に画像を置いて、その画像をCSSでセンターに持って行きたいです。
現在ＣＳＳで
.img1{
margin:auto auto auto auto;
}
っていう感じで書いていますが、全然センタリングできません。。
画像のセンタリングはどうやってやればいいでしょうか？
初心者なので書き足りないことがあると思いますが、よろしくお願いします。

回答No.2

partita · ベストアンサー

margin:auto;
でセンタリングをするのはブロック要素です。
ブロック要素は
p,table,h1,divなど。

ブロック要素の中身は基本的にはインライン要素で形成されます。インライン要素は主にテキスト、画像です。

imgはインライン要素（置換要素）なので、これをセンタリングするときには、imgを含むブロック要素、例えばpやtdに
text-align:center;
を適用します。

初心者の方は、まずブロック要素とインライン要素の違いを明確にするとよいでしょう。そうすれば
text-align:centerなのかmargin:autoなのか、区別が出来ると思います。

回答No.1

goldfox

インライン要素はtext-alignとvertical-alignで。
.img1{
text-align:center;
vertical-align:middle;
}

<table>
<tr>
<td class="img1"><img src="" alt=""></td>
</tr>
</table>

お礼

ありがとうございます。
verticalっていうのは縦のセンタリングですよね？
指定は<td>にするんですね・・・
ありがとうございます。早速やってみます＾＾