如何在页面上的DIV中居中可变宽度的图像？

Question

我有一个可变宽度的图像,我想在一个容器div中居中,它将以页面为中心.

如果我设置了一个宽度div并给它一个margin: 0 auto,它将居中,但问题是内部的图像div是可变宽度的,所以我不能在容器上设置宽度div.

有什么建议？

澄清:容器div的背景图像需要在图像的两侧扩展30px.因此,容器div需要具有设定的宽度,但能够根据图像大小进行扩展/收缩.

Answer 1

添加填充到图像!

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