Javascript CSS Html中的主页背景图像大小问题

我有一个通过CSS的背景图像主页设计。但是，当页面加载左侧的一部分时，右侧的一部分保持白色。我想让它适合屏幕

这是我的HTML：

<header>
  <section class="bg">
      <div [style.color]="'white'">
        <h1>  Welcome to Shopping Cart</h1>
        <h2>  Online grocery purchase made easy.</h2>
      </div>
  </section>
</header>

}

我试过使用宽度为100vw的

width

，但不起作用。右边变得更伸展，左边仍然是空白的白色部分。设置<代码>宽度：84vw使其在右侧正确。但左边还是空白。我无法将背景图像移到左侧。如何使整个背景图像适合屏幕

主页图像：

将其放入CSS中：

.bg {
    width: 100vw !important;
}

---

查看父容器的边距。页眉或页眉的父项上是否有页边距。如果这些边距归零，您提供的代码应该可以正常工作。 我把正文的边距调零，让你明白我的意思：

正文{
保证金：0
}
.bg{
背景图像：url（'https://i.ytimg.com/vi/tog3dRQxENs/maxresdefault.jpg');
高度：100vh；
背景位置：中心；
背景重复：无重复；
背景尺寸：封面；
背景附件：固定；
}

钢笔：

---

不起作用！它向右边伸展。在左边还有一个白色的PortionTanks哥们！成功了。通过将父级保证金改为零，解决了我的问题。太好了！很高兴我能帮忙。

.bg {
    width: 100vw !important;
}