为什么网格系统的宽度大于体？答案

【问题标题】：Why the width of grid system is more greater than body?为什么网格系统的宽度大于体？
【发布时间】：2019-08-10 13:43:35
【问题描述】：

首先，我的母语不是英语，希望问题和描述清楚。如果不是，我很抱歉。

问题：

我正在使用 MDB 框架，当我使用网格系统时，最后一列的宽度大于正文。我试着把 widht: 100%;在内容和每一列中（类别：Nx）。

我该如何解决这个问题？

HTML：

<div class="Mycolumns">
    <div class="row">
        <div class="col-8 N1" style="background-image: url(Resources/img/1.jpg); background-repeat: no-repeat; background-size: cover;">

        </div>
        <div class="col-4 N2" style="background-image: url(Resources/img/Sin%20t%C3%ADtulo-1.jpg); background-repeat: no-repeat; background-size: cover;">

        </div>
        <div class="col-4 N3" style="background-image: url(Resources/img/3.jpg); background-repeat: no-repeat; background-size: cover;">

        </div>
        <div class="col-4 N4" style="background-image: url(Resources/img/4.jpg); background-repeat: no-repeat; background-size: cover;">

        </div>
        <div class="col-4 N5" style="background-image: url(Resources/img/5.jpg); background-repeat: no-repeat; background-size: cover;">

        </div>
    </div>
</div>

CSS：

.N1, .N2{
height: 500px;
}

.N3, .N4, N5{
 height: 300px;
}

【问题讨论】：

我已经修好了，我只需要将 container-fluid 添加到我的第一个 div 中

标签： html css bootstrap-4 material-design

【解决方案1】：

我刚刚遇到了同样的问题。所做的是我的嵌套元素之一被设置为宽度：100vw - 视图宽度似乎是整个浏览器窗口包括滚动条，所以你有效地得到'100％+滚动条宽度'为你的宽度，这给了我 15px 左右的井喷。将元素的宽度更改为 100% 可以修复它。

【讨论】：