设置select2的高度

Question

如何增加select2建议下拉列表的高度？

我尝试了https://github.com/select2/select2/issues/144提出的想法：

.select2-results {
  max-height: 500px;
}

然而，这不起作用。如果我改为设置min-height属性，则大小会增加，但是，如果只有1个或2个项目，我不希望有500px的巨大下拉...所以min-height实际上不是选项。

我希望下拉菜单动态调整其高度到内容，但在显示滚动条之前将其高度增加到500px。

Answer 1

尝试使用：

.select2-results__options {
   max-height: 500px;
}

如果这不起作用，请尝试添加!important，以便覆盖默认的最大高度（尝试这两种方法，你的和我的）。

Answer 2

我认为您需要设置.select2-drop和.select2-results类，如下所示：

.select2-drop {
    max-height: /* Your value here */;
    overflow: scroll;
}

.select2-results {
    max-height: 100%;
}

这可确保结果不受高度限制，并且下拉列表仍可使用。如果你测试它，你应该看到它适用于变量列表长度，无论你如何设置.select2-drop上的最大高度。较短的列表应该适合内容，长列表应该在该限制内滚动。

Answer 3

以上所有答案对我都没有用，但这确实有用。我将其放在此处以供Google将来参考：

.select2-container--default .select2-results > .select2-results__options {
    max-height: 400px;
    min-height: 400px;
    overflow-y: auto;
}