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

我正在网站上工作。所讨论的问题页面在这里：在最小化的Firefox窗口中正确调整图像大小

http://bit.ly/I4YR2T

目前，我有图像在表中。我也为这些图像使用了Shadowbox。

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

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

此页面的图片数量最多，也是最令人担忧的，不过我注意到整个网站在Firefox中并没有像Chrome & Safari那样好的缩小比例。我还没有检查过IE。

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

任何人都可以指导我如何解决这个问题？

非常感谢！ “

来源

2012-04-08 jse

请参阅this answer”最大宽度不适用于内联元素，因此您将在浏览器中获得不一致的行为......如果您设置div img {display：block}，然后对齐img ...标记用花车代替标准内联。“这可能意味着摆脱您的表格或将表格单元格设置为块显示。

来源

2012-04-08 07:42:53

谢谢！所以这是一个测试页面（http://bit.ly/HrMqiT），我用这个测试页面中的图片不再在表格中;他们只是漂浮。但是，当我在任何浏览器中再次缩小窗口时，图像溢出容器。你有什么指导我做错了吗？ – jse 2012-04-08 17:25:41

您在该页面上的图像位于固定宽度的容器中。这些图像只有在它们所在的容器具有流体宽度时才会重新调整大小，而这对于一个分区不是标准的。这个滑块会为你做，虽然我已经使用它，它运作良好 - http://marktyrrell.com/labs/blueberry/ – 2012-04-08 23:36:46

谢谢你的帮助！我已经想出了一个解决方法，但蓝莓看起来对未来的工作非常有前途。 – jse 2012-04-09 17:18:30

与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%;代码，因为我想让我的图像显示居中。现在工作很好。

来源

2014-02-06 02:15:11 user3250805

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

回答

相关问题