bootstrap中水平表单下的form-group的margin属性问题

Question

.form-horizontal .form-group{
    margin-left:-15px;
    margin-right:-15px;
}

实际运用时，浏览器下方会产生一个滚动条，内容宽度比浏览器宽度大了30px。

<form class="form-horizontal">
    <div class="form-group">
      <label for="name" class="col-md-2 control-label">表单的类名为form-horizontal,记得要有form-group</label>
      <div class="col-md-10">
        <input type="text" id="name" class="form-control" placeholder="这里input要用div.col-xx-x包起来,因为form-control类的width为100%,会覆盖.col-xx-x">
      </div>
    </div>
</form>

主要还是想知道这么写的意图。 感觉还不如不写啊(lll￢ω￢)

Answer 1

怎么来解释你这个左右边距-15px呢？我是没有遇到过左右边距-15px难道不应该是正？

下面这个代码应该能解决你这个问题~

.form-horizontal .form-group{
    margin: 0px;
}

Answer 2

给.form-group负边距应该是代替.row的作用，减少嵌套复杂度。
.row用负边距，一是因为需要无限嵌套，用来防止嵌套过程中边距不断增加（脑补一下），二是因为，bootstrap是响应式布局，不能让屏幕变小的时候内容紧贴着屏幕，.container就给了个内边距，内层栅格也有自己的边距，所以要把这个边距用负边距抵消掉

Answer 3

虽然是很久以前的问题，但还是想强答一波。
版本问题也会引起