如何在页面上的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;
}

Answer 2

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

图像元素是替换元素，其固有宽度将允许它居中而没有明确的宽度设置。

Answer 3

也许将图片设置为背景和中心它会起作用？