Css 如何修复中间的引导导航切换按钮

我在bootstrap 4导航中遇到问题，我想设置左侧徽标/品牌和中心导航按钮以及右侧登录/我的帐户按钮，我已尝试解决此问题，但当我单击手机上的导航按钮时，它突然向右移动，请查看代码播放

我的帐户
导航栏
中的
容器
是一个
flex
具有
justify content:space-between
，因此最初隐藏的
navbar collpase
将显示在切换按钮下方

解决方案：
将
导航栏collpase
绝对定位到导航栏将解决此问题

例如：

@media only screen and (max-width: 600px) {
  .navbar-collapse{
        position: absolute;
        width: 100%;
        top: 56px; /*height of navbar in mobile*/
    }
}

导航栏
内的
容器
是一个
弹性体
，具有
调整内容：在
之间的空格，因此最初隐藏的
导航栏collpase
会显示在切换按钮下方

解决方案：
将
导航栏collpase
绝对定位到导航栏将解决此问题

例如：

@media only screen and (max-width: 600px) {
  .navbar-collapse{
        position: absolute;
        width: 100%;
        top: 56px; /*height of navbar in mobile*/
    }
}

您只需在
order-md-0 order last
上使用
navbarcollapse
，以便它在移动屏幕宽度上的最后位置（当Navbar折叠时）











相关：
您只需在
order-md-0 order last
上使用
navbarcollapse
，以便它在移动屏幕宽度上的最后位置（当Navbar折叠时）











相关：
谢谢，先生，但我想在我减少或增加窗口选项卡时，然后切换按钮自动出现在中心，导航链接应该像essayshar.com导航一样居中，我在codeplay网站上尝试过此代码，请检查我的代码，如果你想导航链接也居中，也添加此类
.navbar light.navbar nav.nav link{text align:center；}
先生，我希望看起来像essayshark.com导航在bootstrapsThanks中一样，先生，但我希望当我减少或增加窗口选项卡时，切换按钮自动出现在中心，导航链接应该像essayshar.com导航一样居中，我已经在codeplay网站上尝试过这个代码，请检查我的代码如果你想导航链接也居中，也可以添加这个类
.navbar light.navbar nav.nav link{text align:center；}
先生，我想在引导中看起来像essayshark.com导航一样
 <div class="collapse navbar-collapse order-md-0 order-last" id="navbar4">
    <ul class="navbar-nav ml-auto">
      <li class="nav-item bg-white border-success"> <a class="nav-link" href="#">Features</a> </li>
      <li class="nav-item"> <a class="nav-link" href="#">Pricing</a> </li>
      <li class="nav-item"> <a class="nav-link" href="#">About</a> </li>
      <li class="nav-item"> <a class="nav-link" href="#">FAQ</a> </li>
    </ul> 
 </div>