自动增加和减少多选多个bootstrap select2的高度

Question

我使用bootstrap 3和select2进行多选，用户可以选择一年中的月份。如果我要选择一年中的所有月份，就像你在图像中看到的那样，选择会占用比输入更多的空间。

是否可以自动增加和减少输入高度以匹配选择？

我尝试使用height: auto在select中添加css内联，但这不起作用。即使指定高度也不起作用。

HTML

<select class="form-control" id="scheduler_months" multiple style="width: 100%">
    <option selected value='1'><?=_("Janaury")?></option>
    <option value='2'><?=_("February")?></option>
    <option value='3'><?=_("March")?></option>
    <option value='4'><?=_("April")?></option>
    <option value='5'><?=_("May")?></option>
    <option value='6'><?=_("June")?></option>
    <option value='7'><?=_("July")?></option>
    <option value='8'><?=_("August")?></option>
    <option value='9'><?=_("September")?></option>
    <option value='10'><?=_("October")?></option>
    <option value='11'><?=_("November")?></option>
    <option value='12'><?=_("December")?></option>
</select>

更新

由于我没有意识到select2正在创建问题，因此我发现了问题here，只是使用以下css来解决我的问题。

.select2-selection--multiple{
    overflow: hidden !important;
    height: auto !important;
}

所以现在我得到