Bootstrap 3复选框-在复选框和文本之间添加空间

Question

我正在尝试在复选框和复选框文本之间添加一个空格。如何在这些元素之间添加所需的空间？我添加了一个边距右边，但这没有效果。

这是我的html代码：

<div class="checkbox">
  <label><input type="checkbox" value="">Option 1</label>
</div>

Answer 1

尝试此代码：

CSS：

.check-space{
  margin-right: 15px;
}

html：

<div class="checkbox">
  <label><input type="checkbox" value="" class="check-space">Option 1</label>
</div>

Answer 2

尝试覆盖复选框的默认引导程序样式。

在下面的示例中，我添加了10px与默认样式的填充差异，您可以相应地更改它们以修复您的设计。

.checkbox label, .radio label {
    padding-left: 30px !important;
}
.checkbox input[type=checkbox], .checkbox-inline input[type=checkbox], .radio input[type=radio], .radio-inline input[type=radio] 
{
    margin-left: -30px !important;
}

Answer 3

这正在尝试。

.checkbox label, .checkbox input[type=checkbox]{
    margin-left: 55px;
}