将导航栏品牌与页面左侧对齐

Question

如何将导航栏品牌与页面左侧对齐？我希望我的网站名称与菜单列表位于同一行。

这是我当前的菜单栏： Current Navigation Bar

注意，在我的当前导航栏中，我的网站名称位于菜单列表上方。

这是我保存在 Bootply.com 的代码： https://www.bootply.com/ksxCEDHXPo

非常感谢。

Answer 1

我想通了。我希望我的菜单看起来像这样：

Click here for my expected navigation menu

我需要将列跨度设置为 navbar-brand 和 navbar-collapse 参数。 这是我之前的代码： 网站名称

    </div>
<div class="collapse navbar-collapse" id="myNavbar"> 

这是我的更新代码：

    <nav class="navbar navbar-default">

    <div class="container-fluid">

    <div class="navbar-header">

      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#myNavbar">

        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>                        
      </button>

      <a class="navbar-brand col-md-4" href="#">Awesome Theme</a>

    </div> <!-- nav-header -->
    <div class="collapse navbar-collapse col-md-8" id="myNavbar">    

      <?php 
            wp_nav_menu(array(
                'theme_location'=>'primary',
                'container' => false,
                'menu_class'=>'nav navbar-nav navbar-right'
            )
        );
      ?>

  </div><!-- collapse -->
</div><!--  container-fluid  -->
</nav>

有关列的更多信息，请访问以下网站： https://www.w3schools.com/bootstrap/bootstrap_grid_system.asp