css - 图像在最小化的 Firefox 窗口中没有正确调整大小

Question

我在一个网站上工作。有问题的问题页面在这里：

目前我有一张桌子上的图像。我也在为这些图像使用 Shadowbox。

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

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

这个页面有最多的图像，也是最令人不安的，尽管我注意到整个站点在 Firefox 中的缩小不如在 Chrome 和 Safari 中那样好。我还没有检查IE。

我知道这一定是由于我的一些劣质 CSS 造成的。

谁能指导我如何解决这个问题？

太感谢了！

score 1 · Accepted Answer

看到这个答案“最大宽度不适用于内联元素，所以你会得到不一致的行为跨浏览器......如果你设置 div img { display:block } 然后将 img... 标记与浮动对齐，你可以实现它标准内联。” 这可能意味着摆脱您的表格或将表格单元格设置为显示为块。

score 0 · Accepted Answer

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

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

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

2 回答 2