Question

如果我想在同一行的下拉按钮之前显示文字，我该如何让下拉列表正确对齐？使用这个html，它与div的左边缘对齐（即“选择”一词）。但是如果我将跨度放在dropdown div之外，则div开始一个新行。

<div class="dropdown">
    <span>Choose: </span>
    <button class="btn btn-default dropdown-toggle" type="button" id="choice-dropdown" data-toggle="dropdown">Choice 
        <span class="caret"></span>
    </button>
    <ul class="dropdown-menu" aria-labelledby="choice-dropdown" id="choice-dropdown-list">
        <li><a href="#">a</a></li>
        <li><a href="#">b</a></li>
        <li><a href="#">c</a></li>
    </ul>
</div>

Answer 1

将其添加到下拉列表中，并将范围移至外部：

<span>Choose: </span><div class="dropdown" style="display:inline-block;">

如何将Bootstrap下拉列表与触发按钮对齐

1 个答案: