responsive-design - 什么是最小高度 : 100% do when nothing has an explicit height?

Question

我的 university website仅在 Opera 12.xx 上有一个奇怪的问题(据我所知)所有内容都被荒谬地间隔开，巨大的空白区域将所有部分分隔开。

当我检查 CSS 时，我注意到有几个容器具有 min-height: 100% 属性，包括 html 和 body，但没有干预的 parent 有明确定义的高度。我的猜测是 Opera 一直沿 DOM 树向上递归，并且由于到达顶部，使所有这些至少达到 viewport 高度的 100%。

根据我对 CSS 的理解，这似乎应该发生。那么我的问题是:

• 这是应该发生的事情，还是我误解了什么？
• 如果是这样，为什么这个问题只影响 Opera 12？ (Opera 15 是免疫的，因为它使用了 Webkit，我知道。我的意思是，为什么 Webkit 可以正常显示？)
• 所有这些最小高度声明的意义何在？似乎(再一次，在我的理解中)是对 100% 的回答，这不是强制标记的元素将它们的高度基于它们的父元素 em>内容，而不是自己的？这有什么意义？

一位大学网站管理员告诉我必须这样做，因为该网站采用响应式设计，虽然我承认我并不完全理解所有流行词的含义，但我不明白这与它有什么关系。

Answer 1

如有疑问，请咨询the spec :

If the height of the containing block is not specified explicitly (i.e., it depends on content height), and this element is not absolutely positioned, the percentage value is treated as '0' (for 'min-height') or 'none' (for 'max-height').

Opera 的行为与规范概述的内容不一致，因此这是一个浏览器错误。