最大高度有时有效，但并非总是[重复]答案

【问题标题】：Max-height works sometimes, but not always [duplicate]最大高度有时有效，但并非总是[重复]
【发布时间】：2016-08-16 13:05:16
【问题描述】：

我有一个响应式网站。我的图像存在于我称为“预览”的 div 窗口中，它们不应超过窗口的高度。它似乎适用于某些图像，我不知道为什么它不适用于所有图像。

可能没有必要，但这是我的 div 代码。

.preview {
    max-height: 100%;
    max-width: 100%;
}

这是一个有效的图像示例。

<img class="preview" src="assets/works/design/posters/spring2016.jpg">

这个不工作。它高于 div 高度。

<img class="preview" src="assets/works/reindeer.jpg">

这是我的网站：alexjberger.com

有人有什么见解吗？我很感激。

【问题讨论】：

访问了您的网站，无法弄清楚您想说什么，但后来我终于明白了。 div 本身永远不会超过 100%。这是图像。我建议将此添加到您的 css 中：.preview img { max-height: 100%; max-width: 100%}
看起来你得到了答案，只是想说你写生的东西很棒，真的很独特。
CSS max-height not working 或 max-height: x% doesn't work 的可能重复

【解决方案1】：

您还需要为图像父级p 指定高度以使其正常工作。

对于一个要遵守以百分比给出的高度的元素，它的父元素也必须有一个高度，如果它也以百分比给出，则下一个父元素等等。通常以这条规则结束html, body { margin: 0; height: 100%; }

【讨论】：