Question

我想将Bootstrap标签和文本框放到同一行（在这里我需要将标签放在文本框的前面）

代码：

<div class="form-group">
</div>
<div class="col-md-4 col-md-offset-8">
    <label class="col-sm-2 control-label">Total Tax</label>
    <input type="text" class="form-control" id="tottax" />
</div>

JSFiddle

Answer 1

如果要显示this，则需要使用表单水平。

<div class="form-horizontal">
    <div class="form-group">
        <label class="col-md-2 col-sm-3 col-xs-4 control-label">VAT</label>
        <div class="col-md-9 col-sm-9 col-xs-8">            
            <textbox class="form-control">teetetet</textbox>
        </div>
    </div>
</div>

http://jsfiddle.net/h26d70k9/2/

Answer 2

我通常在行中使用行来解决这样的问题。

此代码适用于我：

<div class="form-group">
    <div class="row">
        <div class="col-md-6 pull-left">
            <label class="control-label">Total Tax</label>
        </div>
        <div class="col-md-6">
            <input type="text" class="form-control" id="tottax" />
        </div>
    </div>
</div>

http://jsfiddle.net/d2kt0kp2/

更改Bootstrap标签位置

2 个答案: