当浏览器调整引导程序3.5时，导航栏不是100％宽度

Question

我有一个导航栏，当浏览器调整大小小于760px时，宽度不适合100％

<nav class="navbar navbar-inverse navbar-static-top" style="margin-bottom:0;">
    <div class="container">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header page-scroll">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="#">
                <img src="#">
            </a>
        </div>

        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="navbar-collapse collapse" id="bs-example-navbar-collapse-1" style="height: 1px;">
            <ul class="nav navbar-nav navbar-left">
                <li class="hidden"><a href="#"></a></li>
                <li class="divider-vertical"></li>
                <li><a href="#">Home</a></li>
                <li class="divider-vertical"></li>
                                <li><a href="#">Login</a></li>

                <li class="divider-vertical"></li>
                <li><a href="#">Signup</a></li>
                <li class="divider-vertical"></li>
                <li>
                    <form action="#">
                        <a href="#">Request</a>
                    </form>
                </li>
                <li class="divider-vertical"></li>
                <li><a target="_blank" href="#"></a></li>


            </ul>

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

以下是我使用的一些自定义css

@media (min-width: 760px) {
    .container {
        padding-left: 20px;
        padding-right: 20px;
        width: auto
    }
}

Answer 1

添加此CSS：

@media (max-width: 760px){
    .container {
        width: 100%;
    }
}

.container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header {
    margin-right: 0;
    margin-left: 0;
}

这是一个小提琴https://jsfiddle.net/u27r6dL2/3/