保持select2元素与滚动固定大小？

Here is a fiddle for example.保持select2元素与滚动固定大小？

这个例子说明是与正常的多选SELECT2元件作为用户从列表中选择将扩大下来并引起父容器扩大下来的物品。由于移动和布局方面的担忧，我无法让父母的身材比他们的身材更大。

如何设置一个选项来禁用元素的扩展，或者至少设置CSS来保持元素的大小并允许用户滚动？

防止linkrot的代码如下。

HTML：

<form> 
    <select class="select-select2" multiple="multiple" data-placeholder="Please choose one or more" data-allow-clear="true" data-close-on-select="false"> 
<option>Lorem</option> 
<option>ipsum</option> 
<option>dolor</option> 
<option>sit amet</option> 
<option>consectetur</option> 
<option>adipisicing</option> 
<option>elit sed</option> 
<option>do eiusmod</option> 
<option>tempor</option> 
<option>incididunt</option> 
<option>ut labore</option> 
<option>et dolore</option> 
<option>magna aliqua</option> 
<option>Ut enim ad</option> 
</select> 
    <button type="submit">Submit</button> 
</form>

JS：

$(".select-select2").select2();

来源

2015-09-25 o_O

http://jsfiddle.net/8svf11yh/1/

.select2-container .select2-selection { 
    height: 60px; 
    overflow: scroll; 
}

或者溢出：汽车;可能是一个更好的选择

来源

2015-09-25 17:47:52 smcd

完美 *我想我此评论小时前加入，并没有注意到有人告诉我，我需要更多的字符。谢谢。 –

感谢它的工作...... – prasanthrubyist

它的工作..但如果你让它像“overlow：auto”，它看起来更美丽和真实。没有滚动条显示，但像滚动条区域一样工作。 – saadk

一些改进，以@ SMCD的版本：

.select2-selection--multiple { max-height: 10rem; overflow: auto }

我使用max-height因此，如果只选择几个选项，它可以更小。只有达到那个高度，它才会变大。建议overflow: auto是伟大的，因为它只在需要时使用滚动条。最后，我定位选择器的--multiple变体，以便只有具有多个选项的选项才能获得此样式。

来源

2016-12-16 12:23:07

这将与最新的选择2插件工作：

.select2-results__options { 
    height: 60px; 
    overflow-y: auto; 
}

来源

2017-04-19 06:32:13 adamj

保持select2元素与滚动固定大小？

回答

相关问题