导航栏在移动设备上折叠时，背景主体会向上滚动

Question

当我单击导航项目时，导航栏将关闭，并且背景主体也会向上滚动到相同的大小，直到导航栏关闭，并且在导航栏关闭时停止滚动。这仅在移动设备上发生。我尝试了overflow: hidden，但是它不起作用。

任何想法如何解决？

这是我的代码

<nav class="navbar sticky-top navbar-expand-lg navbar-dark bg-primary">
  <a class="navbar-brand" href="#">Azam Badar</a>
  <button class="navbar-toggler navbar-toggler-right collapsed" type="button" data-toggle="collapse" data-target="#navbarColor03" aria-controls="navbarColor03" aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
    </button>

  <div class="collapse navbar-collapse" id="navbarColor03">
    <ul class="navbar-nav ml-auto">
      <li class="nav-item">
        <a class="nav-link" href="#home">Home <span class="sr-only">(current)</span></a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#techstack">Techstack</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#projects">Projects</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#socialwall">Socialwall</a>
      </li>
      <li class="nav-item">
          <a class="nav-link" href="#let'stalk">Let's Talk</a>
        </li>
    </ul>

  </div>
</nav>

请点击下面的两张图片，当我单击导航图标并且导航栏打开时，主体（在这种情况下为myprojects）向下滚动，反之亦然。

非常感谢

Answer 1

很高兴看到CSS代码，但我想您在某处错过了position:absolute。您的导航必须定位为绝对位置，并且比容器大z-index，否则您将无法看到它。希望这对共享CSS代码有帮助，如果不能的话，我可以检查一下:)