twitter-bootstrap Bootstrap 3：在字段顶部标记并在表单内联提交按钮

Bootstrap 3 : Label on top on field and submit button in a form inline

提问by Portekoi

I'm trying to align 3 selects menus and a submit button with bootstrap 3.

我正在尝试将 3 个选择菜单和一个提交按钮与引导程序 3 对齐。

I've try with rows and inline attribut like this but it doesn't works :

我已经尝试过像这样使用行和内联属性，但它不起作用：

    <div class="row">
        <div class="col-md-3">
            <div class="form-group">
            <label class="control-label" for="date_deb">Date D&eacute;but</label>
            <select name="date_deb" id="date_deb" class="form-control">
                <option value="07/11/2012">07/11/2012</option><option value="30/09/2012">30/09/2012</option>            </select>
          </div>
        </div>
        <div class="col-md-3">
            <div class="form-group">
            <label class="control-label" for="date_deb">Date D&eacute;but</label>
            <select name="date_deb" id="date_deb" class="form-control">
                <option value="07/11/2012">07/11/2012</option><option value="30/09/2012">30/09/2012</option>            </select>
          </div>
        </div>
        <div class="col-md-3">
            <div class="form-group">
            <label class="control-label" for="date_deb">Date D&eacute;but</label>
            <select name="date_deb" id="date_deb" class="form-control">
                <option value="07/11/2012">07/11/2012</option><option value="30/09/2012">30/09/2012</option>            </select>
          </div>
        </div>
        <div class="col-md-3">
        <br/>
        <button type="submit" class="btn btn-success" id="date_search">Rechercher</button>
        </div>
    </div>

and this other solution with inline class :

以及其他带有内联类的解决方案：

<div class="row">
   <div class="col-lg-12">
        <form class="form-inline" role="form" method="post">
            <div class="form-group">
            <label class="control-label" for="date_deb">Date D&eacute;but</label>
            <select name="date_deb" id="date_deb" class="form-control">
            <option value="07/11/2012">07/11/2012</option><option value="30/09/2012">30/09/2012</option>            </select>
        </div>

        <div class="form-group">
            <label for="date_fin">Date Fin</label>
            <select name="date_fin" id="date_fin" class="form-control">
                <option value="07/11/2012">07/11/2012</option>
                    <option value="30/09/2012">30/09/2012</option>              
                </select>
             </div>

          <div class="form-group">
            <label for="date_ref">Date R&eacute;f&eacute;rence</label>
             <select name="date_ref" id="date_ref" class="form-control">
            <option value="07/11/2012">07/11/2012</option><option value="30/09/2012">30/09/2012</option>            </select>
          </div>

          <div class="form-group">
          <br/>
           <button type="submit" class="btn btn-success" id="date_search">Rechercher</button>
          </div>

        </form>
        </div>
    </div>

But form button still not align with selects menus. See below :
_{(source: free.fr)}

但是表单按钮仍然没有与选择菜单对齐。见下文：（ _{来源：free.fr）}

采纳答案by Trevor

You will probably need to use some css in order to align your button with the select dropdowns

您可能需要使用一些 css 来将您的按钮与 select dropdowns

.row .btn {
    margin-top: 5px;
}

http://www.bootply.com/93481

http://www.bootply.com/93481