Set height of select2

D.R. picture D.R. · Oct 30, 2016 · Viewed 14.2k times · Source

How to increase the height of the select2 suggestion dropdown?

I tried the idea proposed at https://github.com/select2/select2/issues/144:

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

However, that does not work. If I instead set the min-height property, the size is increased, however, I do not want to have a 500px huge dropdown if there are only 1 or 2 items...so min-height is not really an option.

I want the dropdown to dynamically adjust its height to the content, but increase its height up to 500px before a scrollbar is displayed.

Answer

Ultrazz008 picture Ultrazz008 · Oct 30, 2016

Try to use:

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

If that doesn't work try to add !important so it overwrite it's default max-height (try both methods, yours and mine).