Keeping select2 element a fixed size with scrolling?
http://jsfiddle.net/8svf11yh/1/
.select2-container .select2-selection {
height: 60px;
overflow: scroll;
}
Or overflow:auto; may be a better choice
A few refinements to @smcd's version:
.select2-selection--multiple { max-height: 10rem; overflow: auto }
I am using max-height
so that it can be smaller if only a few options are selected. Only once it reaches that height does it grow no bigger. As suggested overflow: auto
is great as it only uses the scrollbar if needed. Finally I target the --multiple
variant of the selector so only selections with multiple options get this styling.