html - 推特 Bootstrap 导航栏链接在页面调整大小时移动

Question

每当我将页面大小调整到小于 600 像素时，我的 Bootstrap 导航栏链接(包括搜索)就会消失。这会是什么原因呢？只有 Logo 不会移动。导航栏很好，不会调整大小，所以我很惊讶当页面调整大小时链接消失了。无论页面大小如何调整，我都不希望我的任何链接从它们所在的位置移动。

代码在这里:HTML

http://jsfiddle.net/Crisp3333/2u0tgh5r/

<div class="menubar">
<nav role="navigation" class="navbar navbar-default">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
        <button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggle">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <a href="#" class="navbar-brand"><img src="yancii_logo.jpg" width="40px" height="50px"></a>
    </div>
    <!-- Collection of nav links, forms, and other content for toggling -->
    <div id="navbarCollapse" class="collapse navbar-collapse">
    <form role="search" class="navbar-form navbar-left">
            <div class="form-group">
                <input type="text" placeholder="Search events, places, contacts......" class="form-control">
            </div>
        </form>
        <ul class="nav navbar-nav">

            <li><a href="#">CreateEvent</a></li>
            <li><a href="#">MyEvents</a></li>
            <li><a href="#">Contacts</a></li>
            <li class="dropdown">
                <a data-toggle="dropdown" class="dropdown-toggle" href="#">Messages <b class="caret"></b></a>
                <ul role="menu" class="dropdown-menu">
                    <li><a href="#">Inbox</a></li>
                    <li><a href="#">Drafts</a></li>
                    <li><a href="#">Sent Items</a></li>
                    <li class="divider"></li>
                    <li><a href="#">Trash</a></li>
                </ul>
            </li>
        </ul>

        <ul class="nav navbar-nav navbar-right">
            <li><a href="#">Account</a></li>
        </ul>
    </div>
</nav>

Answer 1

问题是这段代码:/* min-width: 1400px; */您可以在 class -> .navbar

中找到它

它基本上会导致您的下拉菜单不显示。并且菜单按钮不会随您希望的那样调整大小。

希望对您有所帮助!干杯