ページ上のDIVに可変幅の画像を中央に配置する方法は？

私は、コンテナ内に中心を置く可変幅の画像を持っています。divは、ページの中央に配置されます。ページ上のDIVに可変幅の画像を中央に配置する方法は？

私はdivに幅を設定し、それをmargin: 0 autoを与えた場合、それが中心になるが、問題はdivの内部画像は、可変幅であるので、私は、コンテナの上に幅を設定することができないということですdiv 。

提案がありますか？

明確化：画像のいずれかの側に30pxを展開する必要がある背景画像を有するdiv容器。そのため、コンテナdivは、設定された幅である必要がありますが、イメージのサイズに基づいて拡大/縮小できる必要があります。

text-align：center workですか？ –

divの目的は何ですか？それは視覚的な要素ですか？（フレーミング用）幅を設定できる唯一の方法は、JSまたは他のスクリプトを使用することです。 – Moak

@Moak、これはフレーミングの視覚的要素です。 –

画像にパディングを追加！

img#foo{ 
    display:block; 
    margin:0 auto; 
    background:url(/image/bg.gif); 
    padding: 30px; 
}

2009-08-17 15:04:00 Moak

ああ、ちょうどイメージにそれを追加することをお勧めします。「div」は一種の不要なものだったと思います。ありがとうモア！ –

画像を背景として設定して中央にすると効果がありますか？

2009-08-17 14:58:48 Pawka

上記の私の説明を参照してください。ありがとう。 –

img#foo { 
    display:block; 
    margin:0 auto; 
}

画像要素は置き換えられた要素であり、その固有の幅は、明示的な幅の設定をせずに中央揃えにすることができます。

2009-08-17 15:00:51

答えて