如何更改顶部的 Bootstrap 多选下拉位置？答案

【问题标题】：How to change the Bootstrap multiselect dropdown position on top?如何更改顶部的 Bootstrap 多选下拉位置？
【发布时间】：2015-05-21 10:36:28
【问题描述】：

我尝试更改顶部引导多选下拉菜单的位置，但没有成功。下面而不是使用正确的如何显示控件顶部。

<select id="example-dropRight" multiple="multiple">
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
    <option value="4">Option 4</option>
    <option value="5">Option 5</option>
    <option value="6">Option 6</option>
</select>

<script type="text/javascript">
    $(document).ready(function() {
        $('#example-dropRight').multiselect({
            buttonWidth: '400px',
            **dropRight: true**
        });
    });
</script>

【问题讨论】：

我认为菜单是正确的，因为 id "example-dropRight"。可能是根据这个 id 对齐的。检查引导程序中与顶部对齐的下拉菜单。
嗨 Jacky，是的，我想在顶部的控件上方显示它。如果你不使用 dropright，它会向下显示。我想知道如何在顶部显示它。
检查引导程序中与顶部对齐的下拉菜单。
杰克我找不到它。我也为此尝试了 CSS，但没有运气。
这个id "example-dropRight" 有没有添加css？？

标签： jquery html twitter-bootstrap multi-select bootstrap-multiselect

【解决方案1】：

你可以这样做...DEMO

<div class="btn-group dropup" style=" margin: 100px;">
  <button class="btn">Dropup</button>
  <button class="btn dropdown-toggle" data-toggle="dropdown">
    <span class="caret"></span>
  </button>
 <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">
  <li><a tabindex="-1" href="#">Action</a></li>
  <li><a tabindex="-1" href="#">Another action</a></li>
  <li><a tabindex="-1" href="#">Something else here</a></li>
  <li class="divider"></li>
  <li><a tabindex="-1" href="#">Separated link</a></li>
</ul>
</div>

【讨论】：

【解决方案2】：

这是我的回答： <div class="**dropup**"><select id="example-dropRight" multiple="multiple"> <option value="1">Option 1</option> <option value="2">Option 2</option> <option value="3">Option 3</option> <option value="4">Option 4</option> <option value="5">Option 5</option> <option value="6">Option 6</option> </select> </div>

【讨论】：