怎样让bootstrap导航栏不折叠

Question

用bootstrap做了个导航栏，在中小屏幕下自动折叠，贼丑，怎样才能禁止这种折叠行为?

代码如下：

<nav class="navbar navbar-default" role="navigation">
        <div class="container">
            <div class="navbar-header">
                <img src="img/github.png" alt="Github Logo" class="navbar-brand">
            </div>
            <div>
                <form action="" class="navbar-form navbar-left" role="search">
                    <div class="form-group">
                        <input type="text" class="form-control" placeholder="Search Github">
                    </div>
                </form>
            </div>
            <ul class="nav navbar-nav items ">
                <li><a href="#">Pull requests</a></li>
                <li><a href="#">Issues</a></li>
                <li><a href="#">Gist</a></li>
            </ul>
            <ul class="nav navbar-nav user navbar-right">
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                        <span class="glyphicon glyphicon-plus"></span><span class="caret"></span>
                    </a>
                    <div></div>
                    <ul class="dropdown-menu">
                        <li><a href="#">New repository</a></li>
                        <li><a href="#">Import repository</a></li>
                        <li><a href="#">New gist</a></li>
                        <li><a href="#">New organization</a></li>
                    </ul>
                </li>
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                        <img src="https://avatars1.githubusercontent.com/u/25173157?v=3&s=40" alt="头像" style="width: 20px">
                        <span class="caret"></span>
                    </a>
                    <ul class="dropdown-menu">
                        <li><a href="#" class="infor">Signed in as</a></li>
                        <li><a href="#" class="infor username" >Username</a></li>
                        <li class="divider"></li>
                        <li><a href="#">Your profile</a></li>
                        <li><a href="#">Your stars</a></li>
                        <li><a href="#">Explore</a></li>
                        <li><a href="#">Integrations</a></li>
                        <li><a href="#">Help</a></li>
                        <li class="divider"></li>
                        <li><a href="#">Settings</a></li>
                        <li><a href="#">Sign out</a></li>
                    </ul>
                </li>
            </ul>
        </div>
    </nav>

想做成定宽的，不压缩，不折叠，不知道怎么弄，有没有dalao教教我？听说要移除折叠行为？不知道怎么弄

Answer 1

1. 百分比(直接用栅格)

2. 固定外容器最小宽度

3. 响应式做几套css

bs响应式栅格

Answer 2

因为bootstrap是从小适应大，也就是先适应手机屏幕，所以只要调整最小情况下的css就可以了。