试图使侧面导航栏不与顶部导航栏重叠

Question

现在我有2个导航栏。一个在顶部，一个在侧面。调整页面大小并在顶部页面下方形成导航栏的一侧。顶部是响应式的，但没有形成菜单。现在，我只是在尝试获取它，以使侧面导航栏不与顶部导航栏重叠，并且希望侧面导航栏仍然能够响应。侧面导航条形码是从另一个站点https://medium.com/wdstack/bootstrap-sidebar-examples-e363021395ff复制并粘贴的，我使用了折叠到顶部选项的左侧条形码。顶部导航栏的代码是

<nav class="navbar navbar-expand-md navbar-dark navbar-fixed-top">
  <a class="navbar-brand" href="../study/index2.html">
    <img height="30px" width="150px" src="../Logo_White.png">
  </a>


  <!-- <div class="collapse navbar-collapse" id="navbarsExampleDefault"> -->
  <ul class="navbar-nav mr-auto">
    <li class="nav-item">
      <a class="nav-link" href="#">Open an Account
    <span class="sr-only">(current)</span>
    </a>
    </li>
    <li class="nav-item">
      <a class="nav-link" href="#">Log In</a>
    </li>
    <li class="nav-item">
      <a class="nav-link disabled" href="#">Disabled</a>
    </li>
  </ul>
  <form class="form-inline my-2 my-lg-0">
    <input class="form-control mr-sm-2" aria-label="Search" type="text" placeholder="Search">
    <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
  </form>
</nav>

该部分没有CSS。在一天结束时，我正在寻找侧导航栏不与顶部导航栏重叠，并且在调整页面大小时，它实际上会在顶部形成导航栏（现在是这样）。我确定它与CSS有关。任何帮助将不胜感激。