使用最大高度时，我遇到了流体图像的一些问题。我试图将图像绑定在最多450x450的框中，或任何与图像长宽比不同的任意框。发生的事情是图像的宽度被限制在450px但高度不是，图像溢出了包装div。
我的代码是：
<div class="wrapper">
<div class="container">
<img src="http://i.imgur.com/iw4yOa0.jpg"/>
</div>
</div>
请参阅http://jsfiddle.net/5fuZ5/了解完整代码和css。
我知道我可以通过使用jquery来实现这一点，但我需要一个不需要javascript的响应式解决方案。
答案 0 :(得分：0)
好的，我有类似的问题，没有任何帮助。我的情况是，我有一列流动的图像（适合他们的容器100％的宽度）适用于风景图像，但肖像是巨大的，因为它的宽度适合，因此高和瘦的图像（肖像）有它的宽度适合容器，因此使其高大。
我的解决方案是考虑容器，如果在肖像图像的实例中我将容器设置为景观容器的50％然后当我将图像宽度（当纵向）放入较小的容器时我得到它们比例（ish）。
所以你想要的是2个容器，一个用于纵向和横向，景观一个将是你想要的最大宽度450px。现在让你的肖像容器的宽度为宽度的225px（宽度的一半），如果你的所有图像都是相同的宽高比，那么它们应该很好地匹配并给你一个结构化的网格 - 或者如果单列的肖像图像将或多或少和景观图像一样高。
如果你想看到这个工作（很短的时间），我会留下这个链接，这样你就可以看到我是如何解决它的。这个例子是一封电子邮件（请不要呻吟关于糟糕的编码，它没有完成）我正在制作的模板，我有一列图像（它的响应）包括肖像和风景 - 使用包含在表格中的类肖像图像（class = portrait）但这可能很容易成为div。
http://www.sink140.com/sf-test/single.html
我的主要观点是不再考虑试图控制高度，只是控制容器，让图像填充它，并通过调整容器的宽度（使其变小）自然地降低图像的高度。
图像的宽高比通常会确保您可以预测布局，因为您有各种基线 - 肖像图像与景观图像相关。
希望这有助于或至少给你一个想法。