使用 bootstrap 页面右侧的可滚动空白

Question

的页面内容右侧得到了一些可滚动的空白

我不确定到底是什么原因造成的，或者我如何在不手动检查每一行的情况下找出答案。我确定它很简单，就像缺少括号一样，但我不确定。我看到其他几个人有这个问题，但还没有找到明确的答案。它也只出现在 index.html 页面上，这让我最困惑，因为它们都是从同一个模板构建的。

Answer 1

您的

似乎有问题

<div class="row no-gutters px-5 my-5">
  <div class="col-10 offset-8">
    <h2 class="text-warning h5 mr-5 pr-5">

您可以简单地将第二个 div 重命名为 <div class="col-2 offset-8"> 以获得类似的结果。

这里还留有几px的白卷，这是<div class="header">

造成的

要解决此问题，请添加以下 css 规则：

.row.justify-content-center {
   max-width: 100%;
}

Scrollable whitespace to right of page using bootstrap