任何人都可以弄清楚这个 CSS 高度怪癖答案

【问题标题】：Can anyone one figure this out CSS height quirk任何人都可以弄清楚这个 CSS 高度怪癖
【发布时间】：2017-02-08 08:30:27
【问题描述】：

好吧，这让我完全被难住了，我已经尝试修复了好几天，但无济于事。

我使用 cbpFWTabs.js 来拆分我的内容。

然而，它的行为似乎很奇怪，因为它忽略了我的高度参数并将 div 设置为内容大小。

阻止这种情况的唯一方法是设置固定高度，但我希望 div 动态调整大小以填充屏幕的其余部分，并在超出 content-wrap div 时显示滚动条（保持菜单栏固定）。

我检查了所有父母，但似乎对我尝试的任何事情都没有反应:(

我确信我错过了一些微不足道的事情，但它让我发疯了。

谢谢！

【问题讨论】：

在响应式设计中，用height: 100% 之类的东西填充最外面的容器总是一件好事，所以那里没有错！但是请注意this，这似乎有点出乎意料。
一种解决方案可能是使用vh 单位来填充屏幕高度...在此之间请添加一个 sn-p / fiddle 而不是发布外部链接...谢谢！
好的，这很奇怪 html 高度设置正确，正文我得到 975px 但它的子 line-section-current 或其他东西设置得太 1189px，它的高度参数设置为 100% 为什么有什么想法为什么会这样？

【解决方案1】：

只要你在一个元素上有height: 100%，这意味着它将继承其父元素的高度。

因此，您需要做的第一件事是在.container 上设置height: 100%，使其高度占据body 的整个高度。

然后，在.container > section 上设置height: 100%。然后，孩子们知道伸展到正确的高度（从body 向下传播）。

这应该可以解决您的 OP 中的问题。但是，您的身高似乎仍然有问题。如果需要，请随时提出另一个问题。

【讨论】：

谢谢看起来是朝着正确方向迈出的一步。我用您的更改更新了页面，它正在填写。但现在它的尺寸有点过大，现在看看，试着弄清楚发生了什么:)
不确定是什么将它放大到这么高，height: 83% 效果很好，但有些东西告诉我这不应该像这样发生..
是的，它仍然太大了 :( 这完全让我感到困惑，我现在不知道为什么它检测到浏览器高度比实际大 300px，并且设置固定高度根本不理想，因为滚动栏将在窗口调整大小时消失
哈哈，原来我只需要将内容包装的高度应用为 vh -（标题高度），并且繁荣效果很好，感谢你们的帮助！