如何强制选择下拉菜单向下扩展

Question

我正在使用bash command not found 标记从下拉列表中选择选项，但是由于项数的原因，列表向上，就好像其下拉一样。我正在使用Bootstrap。

检查了其他代码，但未找到任何结果。

select

---

当菜单中有更多选项时，此选项向上。我希望它朝下。

Answer 1

尝试<select id="year" size="5">也可以使用CSS调整高度

Answer 2

您可以像

一样使用CSS

CSS：

Observable

如果要更改选项的宽度，可以在CSS中执行以下操作：

Observable.concat (
    Observable-A.retry(ERROR),
    Observable-B.retry(ERROR),
    Observable-C.retry(ERROR)
)

Answer 3

只需使用data-dropup-auto="false"

示例：

<div class="select-style" data-dropup-auto="false" style="display: inline-block;">
    <select id="year">
        <option value="hide">-- Year --</option>
        <option value="2010">2010</option>
        <option value="2011">2011</option>
        <option value="2012">2012</option>
        <option value="2013">2013</option>
        <option value="2014">2014</option>
        <option value="2015">2015</option>
        <option value="201">2011</option>
        <option value="2015">2015</option>
        <option value="201">2011</option>
        <option value="202">2012</option>
        <option value="203">2013</option>
        <option value="204">2014</option>
        <option value="205">2015</option>
        <option value="202">2012</option>
        <option value="203">2013</option>
        <option value="204">2014</option>
        <option value="205">2015</option>
    </select>
  </div>

Answer 4

我找到了一个解决方案，该解决方案将强制向下扩展，您可以定义选择的高度。这是小提琴（您需要资源）：JSFiddle

$(function(){
    $('select').chosen({width: '100px'});
    
    $('ul.chosen-results').css('min-height', '100px');
    $('ul.chosen-results').css('max-height', '100px');
});

<select>
  <option value='1'>2010</option>
  <option value='2'>2011</option>
  <option value='1'>2012</option>
  <option value='2'>2013</option>
  <option value='1'>2014</option>
  <option value='2'>2015</option>
  <option value='1'>2016</option>
  <option value='2'>2017</option>
  <option value='1'>2018</option>
  <option value='2'>2019</option>
</select>