css - 为什么在我的 Bootstrap 网格末尾有一条白线/额外的填充

Question

找到答案了!!已贴在下方。我查看了 grid.less 文件，其中设置了网格间距宽度。

我正在用 bootstrap 构建一个响应式网站，使用 less 和 grunt 进行编译。

我使用 Bootstrap div 类网格 col-md-4 制作了 3 个大小相等的网格框。

我不想要边框，也没有添加边框，但在我页面的右侧，滚动条旁边有一个白色间隙，我无法摆脱它。此外，当我缩小窗口尺寸时，其上方的 col-md-12 网格之间会出现白色间隙。我怎样才能解决这个问题？我不知道(对此很陌生)并且搜索不会给我任何解决方案，所以我没有尝试解决这个问题，因为我没有。请提出任何建议。

对于白色间隙

我尝试将 width:100%; 添加到 override.less CSS 文件中。

这是我的代码

HTML

<div class="col-md-4">
    <div class="text-center"><img src="gridimage1SMALL.png"></div>
    <div class="classWithPadTITLES">
        <h2><b>     <center>Title </center>  </b></h2>
    </div>
    <div class="classWithPad">
        <p> content
        </p>
    </div>
</div>

我有 3 个，每个网格框。

CSS

.col-md-4 {
    background-color:#333;  /*replaced old colour rgba(97,7,166,1.00) with grey*/
    color:#fff;
    font-size:20px;
    font-weight:semilight;
    height: 450px;
    width:100%;
    padding:0px;
}

非常感谢任何帮助，谢谢!

Answer 1

我已经在变量中找到了。少了一些设置网格间距宽度的代码:

@grid-gutter-width: 30px;它是 30px，如果我将其更改为 0px 并将其移动到我的重写 variables.less 文件中，我的任何地方都没有白线!