溢出：使用Bootstrap 4，滚动无法在特定的列网格中工作

Question

我的主标记（<main role="main" class="container">）中有3列。第一列有一个包含许多行的表。我希望该列可垂直滚动，同时在页眉和页脚之间保持拉伸状态。我在css中添加了：

#please-scroll{
  height: calc(100% - 110px); overflow-y: scroll
}

但这是行不通的。

这是我的代码：

#please-scroll{
  height: calc(100% - 110px); overflow-y: scroll
}

html {
  height: 100%;
  font-family: sans-serif;
  background: #1F1F1F !important; }

body {
  font-family: sans-serif;
  background-color: #1F1F1F;
  height: 100%; }

.container {
  min-height: calc(100% - 110px) !important;
  margin: 0 auto -33px;
  width: 100%; }

body > .container {
  padding: 60px 15px 0; }

.nav-item .nav-link span {
  border-radius: 10px;
  border: 2px solid;
  padding: 3px;
  font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size: 12px; }

#please-scroll{
  height: calc(100% - 110px); overflow-y: scroll
}

请帮忙！

Answer 1

尝试将CS​​S替换为＃please-scroll ::

#please-scroll{
  height: calc(100vh - 110px);
  overflow-y: scroll;
}