复选框标签与复选框重叠 - Bootstrap3

Question

我正在使用 bootstrap 3，问题是复选框的标签与文本重叠。我尝试了一些事情但没有奏效，所以如果有人能提供帮助，我将非常感激。这是代码的样子，表单的 class 是 form-horizontal

<div class="checkbox">
    <label class="checkbox-inline no_indent">I have read and agree with    privacy and disclosure policy.
    <input name="Terms" id="Terms" type="checkbox" ></label>
</div>

Answer 1

在 Bootstrap 中，样式期望复选框位于第一个，然后是文本，因此设置了 margin-left: -20px。对于您的片段，您需要添加自定义样式。

.radio input[type=radio], .radio-inline input[type=radio], .checkbox input[type=checkbox], .checkbox-inline input[type=checkbox] {
    margin-right: -20px;
    margin-left: 0;
}

Fiddle

Answer 2

应该是这样的，先Bootstrap，<input>后文字。 http://jsfiddle.net/sqax02ah/

<div class="checkbox">
    <label class="checkbox-inline no_indent">
        <input name="Terms" id="Terms" type="checkbox">
        I have read and agree with privacy and disclosure policy.
    </label>
</div>

如果您确实需要在末尾显示复选框，您可以关注其他答案。

Answer 3

尝试将 display: inline-block 用于 .checkbox class，应该会有帮助。或通过保证金改变头寸margin-left: 20px;

复选框标签与复选框重叠 - Bootstrap3

Checkbox Label overlapping the checkbox - Bootstrap3

css

checkbox

twitter-bootstrap