我已尝试使用CSS中的各种类最小/最大高度和宽度,似乎不能阻止顶部导航栏折叠我的下拉菜单.我更喜欢固定的宽度,但全屏菜单固定在顶部.下拉菜单工作正常,但是当我减小浏览器窗口的宽度时它会崩溃.我已经删除了切换,但没有引导的爱.这是bootstrap 2.0中的代码：
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container-fluid">
<a class="brand" href="./index.html">Brand Name </a>
<ul class="nav">
<form class="navbar-search">
<input type="text" class="search-query" placeholder="Search Active Page...">
</form>
</ul>
<ul class="nav pull-right">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<i class="icon-user icon-white"></i> Pages<b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">My Pages</a></li>
<li><a href="#">New Page</a></li>
<li class="divider"></li>
<li><a href="#">Share Your Pages</a></li>
<li><a href="#">Page Browswer</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<i class="icon-cog icon-white"></i> Settings<b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Upload Images</a></li>
<li><a href="#">Upload Files</a></li>
<li><a href="#">Link Other Accounts</a></li>
<li><a href="#">Manage Labels</a></li>
<li class="divider"></li>
<li><a href="#">Privacy Settings</a></li>
<li><a href="#">Help</a></li>
</ul>
</li>
<li> <img src="img/small_fb_pic.jpg" vspace="5px"></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
John<b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">logout</a></li>
<li class="divider"></li>
<li><a href="#">Help</a></li>
</ul>
</li>
</ul> <!-- end left justified menu items -->
</div>
</div>
</div>
解决方法
这适用于可以适应屏幕尺寸(特别是移动设备)的网站上的响应式设计.在这里了解更多：
http://twitter.github.com/bootstrap/scaffolding.html#responsive
要解决这个问题在您的引导解决方案,请转到引导自定义页面,取消选中响应布局并重新下载您的引导文件.
http://twitter.github.com/bootstrap/download.html
它比手动编辑引导文件更好.希望这可以帮助.