减少导航栏;选择并按钮在同一行

Question

我正在使用bootstrap并遇到以下问题。我的导航栏中有一个选择和一个按钮，并且当导航栏缩小（宽度<762）时希望它们在同一行上。

这是一个jsfiddle：http://jsfiddle.net/vuwovq9g/

<div class="nav navbar-nav navbar-form">
    <select class="form-control">
        <option value="">Alphabétique</option>
        <option value="">Modification</option>
        <option value="">Création</option>
    </select></div><button type='button' style="margin-top:10px;" class="glyphicon glyphicon-sort-by-alphabet"></button>

当导航栏较小时，按钮位于选择下方。我试图将按钮放在div中但得到更糟糕的结果（当导航栏很大时，按钮位于选择之下）

Answer 1

jsfiddle demo

将display:inline-block添加到包含您的选择框的div。这样div就会折叠它的宽度，因此按钮有“空间”。