Bootstrap 3在标题内创建内联选择

Question

我想实现这样的目标：，我试图让它工作几个小时但不能这样做，这是我的代码：

＆＃13;

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
<div class="container">
    <div class="row">
        <div class="col-mid-offset-1 col-lg-offset-1 col-mid-5 col-lg-5">
            <div class="form-group">
                <div class="row">
                    <div class="col-xs-7">
                        <h5>Land Area</h5></div>
                    <div class="col-xs-3">
                        <select class="form-control" id="mainSearch-unitSelect">
                            <option>1</option>
                            <option>2</option>
                        </select>
                    </div>
                    <div class="col-xs-2">
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

＆＃13;

＆＃13;

＆＃13;

有什么建议让它发挥作用吗？

Answer 1

试试这个：

https://jsfiddle.net/2bz3jpad/2/

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
<div class="container">
    <div class="row">
        <div class="col-mid-offset-1 col-lg-offset-1 col-mid-5 col-lg-5">
            <div class="form-group">
                <div class="row">
                    <div class="col-xs-6 text-right">
                    <h5><strong>Land Area:</strong></h5></div>
                    <div class="col-xs-3 text-left">
                        <select class="form-control" id="mainSearch-unitSelect">
                            <option>1</option>
                            <option>2</option>
                        </select>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

Answer 2

缩小标签的列并将文本浮动到右侧。

＆＃13;

＆＃13;

MIDDLEWARE_CLASSES

＆＃13;

＆＃13;

＆＃13;

修改

或使用内嵌形式：

http://getbootstrap.com/css/#forms-inline