如何使引导容器流体中的内容适合剩余的视口并滚动其他所有内容？答案

【问题标题】：How to make content inside bootstrap's container-fluid fit within remaining viewport and scroll everything else?如何使引导容器流体中的内容适合剩余的视口并滚动其他所有内容？
【发布时间】：2015-10-28 21:17:33
【问题描述】：

引导层：http://www.bootply.com/WhTXWWl8EP

如果 .container-fluid 中的所有内容溢出 viewportheight，我似乎无法强制滚动。理想情况下 .container-fluid 将填充导航下方的区域，如果任何子元素溢出，则正确使用它们的溢出。而是增加了 .container-fluid 的高度

在 bootply 示例中，panel-body 应该会随着滚动而溢出。

【问题讨论】：

标签： css twitter-bootstrap twitter-bootstrap-3

【解决方案1】：

由于 .panel-body 设置为溢出：滚动，那么您应该设置该类的高度。我将以下内容添加到您的 CSS 中，它开始滚动列表。

.panel-body { height: 10vw; }

【讨论】：

如果可以将高度设置为 100vh-70px 以补偿导航填充，它将起作用。
嗨 jM2.me。你可以这样做.......panel-body{height: -webkit-calc(100vh - 70px); height: -moz-calc(100vh - 70px); height: calc(100vh - 70px);}