填充问题-引导3

Question

看一下Mobile模式下的示例。

示例

在Fieldset 3中，为什么所有的标签和文本框的左边都有一个轻微的padding

Answer 1

就像下面的回答状态一样，您已经为Fieldset 3提供了col-md-6类和form-group。现在，由于您确实需要col-md-6将元素分隔成2列，您可以针对特定的字段集并删除填充。

HTML:

 <form class="form-horizontal" id="fieldset3"> <!-- ID added -->
            <fieldset>
                <legend>Fieldset 3</legend>

CSS:

#fieldset3 .col-md-6{
  padding-left:0px;
}

演示1

为了更方便，你也可以这样对标签进行分组:

<div class="col-md-6">
    <div class="form-group">
        <!-- Label and input here -->
    </div>
    <div class="form-group">
        <!-- Label and input here -->
    </div>
    <div class="form-group">
        <!-- Label and input here -->
    </div>
</div>
<div class="col-md-6">
    <div class="form-group">
        <!-- Label and input here -->
    </div>
    <div class="form-group">
        <!-- Label and input here -->
    </div>
    <div class="form-group">
        <!-- Label and input here -->
    </div>
</div>

演示2

Answer 2

为列嵌套类。首先是div.col-md-6.form-group，然后是label.control-label.col-md-8，所以它将col-*的内边距加倍。