图像未在最小化的Firefox窗口中正确调整大小

Question

我正在网站上工作。问题页面在这里：

http://bit.ly/I4YR2T

目前我将图像放在表格中。我也在使用Shadowbox来制作这些图像。

当我最小化Chrome和Safari中的浏览器窗口时，图像可以很好地缩小。

但是，当我在Firefox中最小化窗口时，图像不能很好地缩小。

这个页面拥有最多的图像并且是最令人不安的，但我注意到整个网站在Firefox中并没有像在Chrome和＆amp;苹果浏览器。我还没有检查过IE。

我知道这一定是因为我的一些伪劣的CSS。

有人可以指导我如何解决这个问题吗？

非常感谢你！

Answer 1

请参阅this answer“最大宽度不适用于内联元素，因此您将通过浏览器获得不一致的行为...如果您设置div img {display：block}然后对齐img，则可以实现它。 ..标签用浮动而不是标准内联。“这可能意味着摆脱你的表或设置表格单元格显示为块。

Answer 2

与Firefox有同样的问题。我让它在Chrome中工作，但Firefox不会显示代码。所以这就是我所做的：

/* begin HeaderObject */
.banner-img {
  display: block; 
  margin: 0 auto; 
  max-width: 99%;
  left: 50%; 
}
/* end HeaderObject */

我将max-width更改为99％并正确显示并正确调整大小。标题对象放在CSS的标题内，所以我试过看看是否可以让它以更小的宽度工作，因为它在标题内“嵌套”。然后我添加了left: 50%;代码，因为我希望我的图像显示为居中。现在工作得很好。