移动和桌面视图中右侧的空间答案

【问题标题】：Space to the right in mobile and desktop view移动和桌面视图中右侧的空间
【发布时间】：2021-05-25 00:20:33
【问题描述】：

我正在制作 Instagram 故事样式模板。到目前为止，我所做的是定义一个流体容器，并在其中添加三列内容，例如进度条、徽标等。

一切正常，除了由于某种原因，在任何分辨率下屏幕右侧都有一个空间。我尝试了几种技术，例如向容器添加 100% 的宽度，从主体中移除填充，但没有任何结果。

这是我的模板的主体和主要组件：

<body style="background-color: #000; overflow-x: hidden;">
  <!-- Container with background color and 100% height -->
  <div class="container-fluid" style="height: 100vh; padding:0px;">
    <div class="row align-items-center">
      <div class="row">
        <!-- Hide on small screens -->
        <div class="col-lg-4 d-none d-lg-block" style="background-color: #F4F4F4;">

        </div>
        <!-- Hide on small screens -->

        <!-- Main content -->
        <div class="col-lg-4" style="background-color: #fff; height: 100vh;">
           ...
        </div>
        <!-- Main content -->

        <!-- Hide on small screens -->
        <div class="col-lg-4 d-none d-lg-block" style="background-color: #F4F4F4;">

        </div>
        <!-- Hide on small screens -->
      </div>
    </div>
  </div>
</body>

这是生成的空间。我涂了黑色，这样更显眼。

Here is a link to my snippet，我真的需要帮助，我不知道这是怎么回事。非常感谢您提前。我知道样式不应该是内联的，在我建站的时候是这样的。

【问题讨论】：

课程行有内边距和边距，您需要查看。
谢谢 Gerard，添加了 padding 和 margin 0。

标签： html css twitter-bootstrap flexbox mdbootstrap

【解决方案1】：

解决了将margin: 0px; padding: 0px; 添加到行类的问题。

【讨论】：