【问题标题】:how to add space between navbar-brand and items in wordpress bootstrap navigation?如何在 navbar-brand 和 wordpress 引导导航中的项目之间添加空格?
【发布时间】:2018-07-18 14:55:12
【问题描述】:

我试图将我的品牌放在左侧,中间留出一点空间,我希望我的导航链接放在右侧。

    <nav class="navbar navbar-expand-md navbar-light bg-faded">
      <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>
      <a class="navbar-brand" href="#">MY NAVBRAND</a>
      <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
       <?php
        wp_nav_menu( array(
            'theme_location'    => 'primary',
            'depth'             => 2,
            'container_id'      => 'bs-example-navbar-collapse-1',
            'menu_class'        => 'nav navbar-nav',
            'fallback_cb'       => 'WP_Bootstrap_Navwalker::fallback',
            'walker'            => new WP_Bootstrap_Navwalker())
        );
        ?>
     </div>
   </nav>

现在要做到这一点,我正在尝试将其添加到我的 css 中,以便在 a 标签(带有类 navbar-brand)和 div(带有类折叠)之间有空间。

  .navbar {
    justify-content: space-between;
   }

但它不起作用,并且标签和链接彼此相邻。

【问题讨论】:

    标签: css wordpress twitter-bootstrap


    【解决方案1】:

    据我了解,您希望导航菜单位于右侧;只需在代码中添加类navbar-right,如下所示。

       <?php
        wp_nav_menu( array(
            'theme_location'    => 'primary',
            'depth'             => 2,
            'container_id'      => 'bs-example-navbar-collapse-1',
            'menu_class'        => 'nav navbar-nav navbar-right',
            'fallback_cb'       => 'WP_Bootstrap_Navwalker::fallback',
            'walker'            => new WP_Bootstrap_Navwalker())
        );
        ?>
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2016-06-03
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多