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

【问题标题】：Image Not Resizing Properly in Minimized Firefox Window图像在最小化的 Firefox 窗口中未正确调整大小
【发布时间】：2012-04-21 02:11:34
【问题描述】：

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

http://bit.ly/I4YR2T

目前我有一张表格中的图像。我也在为这些图像使用 Shadowbox。

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

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

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

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

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

非常感谢！

【问题讨论】：

标签： css image firefox resize

【解决方案1】：

火狐也有同样的问题。我让它在 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】：

see this answer "Max-width 不适用于内联元素，因此跨浏览器的行为会不一致...如果您设置 div img { display:block } 然后对齐 img...带有浮动而不是标准内联的标签。”这可能意味着摆脱您的表格或将表格单元格设置为显示为块。

【讨论】：

谢谢！所以这是我制作的测试页 (bit.ly/HrMqiT)，其中图像不再位于表格中；他们只是漂浮。但是，当我在任何浏览器中再次最小化窗口时，图像会溢出容器。你对我做错了什么有任何指导吗？
您在该页面上获得的图像位于固定宽度的容器中。仅当它们所在的容器具有流体宽度时，图像才会重新调整大小，这对于 sldier 来说不是标准的。不过，这个滑块会为你做这件事，我以前用过，效果很好 - marktyrrell.com/labs/blueberry
感谢您的帮助！我想出了一个解决方法，但蓝莓看起来很有前途。