設置高度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。較短的列表應該適合內容，長列表應該在該限制內滾動。