Css wordpress移动视图中的引导导航菜单

我有两个导航栏在我的标题和它的中心是我的标志。我正在使用WordPress，还包括引导类。我有一个问题，关于在移动视图或之间的最大宽度700+像素的东西。我的导航菜单在低于700像素时被破坏了。我提供了一个屏幕截图来确定我的问题

这也是我的网站：

以下是我的问题的截图：

这是我的密码：

<div class="navbar navbar-inverse navbar-fixed-top">
    <div class="container-fluid">

    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
     </button> 

    <div class="logo-wrapper">

        <div class="logo">
            <?php if ( get_theme_mod( 'm1_logo' ) ) : ?>
            <a href="<?php echo esc_url( home_url( '/' ) ); ?>" id="site-logo" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home">
            <img src="<?php echo get_theme_mod( 'm1_logo' ); ?>" alt="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>"></a>
            <?php else : ?>
                  <img class="logo" src="<?php echo get_bloginfo('template_url') ?>/images/qmark_logo.png"/>
            <?php endif; ?>
        </div>
    </div>

    <div class="half">      
        <ul class="left-navlist">
            <?php
            $args = array(
                  'container'      => 'div',
                  'container_class'   => 'collapse navbar-collapse pull-right',
                  'container_id'      => 'bs-example-navbar-collapse-1',
                  'menu'        => 'left',
                  'menu_class'        => 'nav navbar-nav',
                  'fallback_cb'       => 'wp_bootstrap_navwalker::fallback',
                  'walker'            => new wp_bootstrap_navwalker()
            );
            ?>
            <?php wp_nav_menu($args); ?>
        </ul>
    </div>
    <div class="half">      
        <ul class="right-navlist">
            <?php
            $args1 = array(
                  'container'      => 'div',
                  'container_class'   => 'collapse navbar-collapse',
                  'container_id'      => 'bs-example-navbar-collapse-1',
                  'menu'        => 'right',
                  'menu_class'        => 'nav navbar-nav',
                  'fallback_cb'       => 'wp_bootstrap_navwalker::fallback',
                  'walker'            => new wp_bootstrap_navwalker()
            );
            ?>
            <?php wp_nav_menu($args1); ?>
        </ul>
    </div>
    </div>
    </div>

---

您有一个媒体查询，使导航浮动只剩下最小768px。有些浏览器渲染像素的方式稍有不同，因此您可能已经注意到它并不完全是768px。删除查询（或覆盖查询），您就可以了

@media (min-width: 768px) {
    .navbar-nav>li {
        float: left;
    }
}

不过仅供参考，在400px左右也会出现同样的问题，因此可以使文本在该窗口大小下变小。基本上，当窗口大小为400px时，如果文本保持相同大小，则这些元素的容器太小，会将其中一个容器撞倒（请与我们联系）。同样，这只发生在400px左右。你可能想给它另一种处理方式，就像一个汉堡包图标控制一个滑入视野的导航

---

您有一个媒体查询，使导航浮动只剩下最小768px。有些浏览器渲染像素的方式稍有不同，因此您可能已经注意到它并不完全是768px。删除查询（或覆盖查询），您就可以了

@media (min-width: 768px) {
    .navbar-nav>li {
        float: left;
    }
}

不过仅供参考，在400px左右也会出现同样的问题，因此可以使文本在该窗口大小下变小。基本上，当窗口大小为400px时，如果文本保持相同大小，则这些元素的容器太小，会将其中一个容器撞倒（请与我们联系）。同样，这只发生在400px左右。你可能想给它另一种处理方式，就像一个汉堡包图标控制一个滑入视野的导航

---

我在你的网站上没有看到你试图推翻我的建议或将其删除。当我在inspect元素中修改您的代码时，我将发送一个屏幕截图，显示它为我工作，因此基本上您希望添加

float:left在你的
.nav>里{}
先生，我的宽度是407 x。在屏幕截图中是407 x宽吗？谢谢因为在我的评论中，meI解释说它不起作用，所以你可能必须在400px左右做一些完全不同的风格。我给你的答案解决了你的问题，当你在700px范围内时，为什么它没有保持向左浮动并下降。你会想在400像素左右做这样的事情，我在你的网站上没有看到你试图推翻我的建议或将其删除。当我在inspect元素中修改您的代码时，我将发送一个屏幕截图，显示它为我工作，因此基本上您希望添加
float:left在你的
.nav>里{}
先生，我的宽度是407 x。在屏幕截图中是407 x宽吗？谢谢因为在我的评论中，meI解释说它不起作用，所以你可能必须在400px左右做一些完全不同的风格。我给你的答案解决了你的问题，当你在700px范围内时，为什么它没有保持向左浮动并下降。你会想在400像素左右做类似的事情