我在一个容器元素中有 4 个元素。容器元素的高度将设置为浏览器窗口的 100%。 4 个内部元素将相互垂直堆叠(正常)。前两个元素和最后一个元素应该有一个“自然”高度(即:足以适应它们的内容)。第 3 个元素应该扩展以填充容器中的可用空间，在其他 3 个元素吃完它们需要的所有空间之后。
所以，它看起来像这样:
我无法为 Element-1、Element-2 或 Element-4 设置明确的高度，我也不知道容器的高度。我也不知道 Element-3 的自然高度；我计划使用 overflow-scroll 如果它变得比可用的更大。我在元素之间添加了间距以供说明，但实际元素之间也会有间距(边距/填充)。
如何使用 HTML/CSS 实现这一目标？如果必须做出妥协以获得体面的布局，我会考虑它们。如果该技术也水平应用(我有时需要)，则加分。
最佳答案
关于html - CSS 布局中的 "Whatever is Left"，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/4879087/