Question

我有一个设置为position: fixed的容器div（模态）（绝对不是我的选择）。在此容器中，我有两列。这些列之一包含选项卡按钮，并在其下方包含一些内容或表格。此内容（仅内容，而不是选项卡）应该是可滚动的，但我不知道如何。

选项卡的高度可以更改，因此解决方案不能为选项卡栏包含固定的高度。

我试图通过将列设置为position: relative，min-height: 100%和overflow-y: scroll来使整个列可滚动，但是这种尝试甚至没有效果。

编辑

的副本

Answer 1

之所以发生此问题，是因为您没有在容器“ .details-column”中声明“最大高度”。

尝试以下CSS：

.content { 最大高度：400像素；溢出-y：自动; }

注意：您必须设置容器的固定高度或固定最大高度，否则容器将不知道何时滚动数据。

Answer 2

W3School的摘录：

overflow属性仅适用于具有指定值的块元素高度。

但是由于高度灵活，高度元素不知道何时会溢出，因为它将不断增长。

您很可能必须定义一个高度或最大高度，甚至使用JS来计算高度，我可以提出的其他建议是使用white-space属性以及calc（）作为高度。

编辑： 这里是帮助您了解溢出的很好的来源： https://www.brunildo.org/test/Overflowxy2.html

祝你好运。

Answer 3

通过在CSS之后应用，您的div将可滚动。

.content{
  height: 80%;
  overflow-y: auto; 
}

Answer 4

这是因为没有太多内容可以滚动。.放入一些内容然后尝试..检查下面的链接

overflow-y: auto

将此添加到模态类。谢谢