Bootstrap 4 如何在不破坏原始导航栏布局的情况下添加切换栏？

我正在使用引导建立一个导航栏，左边是我的名字，右边是链接。布局很好，直到我添加了切换按钮。现在它在左边显示我的名字，右边显示链接，而不是在右边（当页面展开时）。当页面最小化时，它看起来很好。我怎样才能解决这个问题

    <nav class="navbar navbar-expand-md navbar-dark bg-dark d-flex justify-content-between">
    <h1 class="text-white"> Aiya Siddig</h1>

    <button class = "navbar-toggler" data-toggle = "collapse" data-target = "#collapse_target">
      <span class = "navbar-toggler-icon" ></span>
    </button>
    <div class = "collapse navbar-collapse" id = "collapse_target">
     <ul class="navbar-nav">
       <li class="nav-item">
         <a class="nav-link" href="index.html"> About Me </a>
       </li>
       <li class="nav-item">
         <a class="nav-link" href="portfolio.html"> Portfolio </a>
       </li>
       <li class="nav-item">
         <a class="nav-link" href="contact.html"> Contact </a>
       </li>
     </ul>
    </div>
   </nav>

艾雅·西迪格

---

您可以在

折叠
导航栏中使用带
柔性端的引导类
，以确保您的链接始终位于更大
屏幕上的
右侧
，并且
响应

现场工作演示：



艾雅·西迪格








现在，当我单击切换栏时，它不会打开links@AiyaSiddig不客气。很高兴能帮忙。快乐编码：）