我尝试自定义 Bootstrap 导航栏,现在展开菜单时遇到问题。
<div class="navbar navbar-inverse navbar-static-top" role="navigation">
<div class="container">
<div class="navbar-header pull-left">
<a class="navbar-brand" rel="home" href="#" title="halp">Help ?</a>
<!-- Placeholder for the collapsed menu -->
<button type="button" data-toggle="collapse" data-target=".navbar-collapse" class="navbar-toggle collapsed pull-left">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<!-- the collapsing menu -->
<div class="collapse navbar-collapse">
<!-- pull-right keeps the drop-down in line -->
<ul class="nav navbar-nav">
<li class="menu active"><a href="#">Home</a></li>
<li class="menu"><a href="#about">About</a></li>
<li class="menu"><a href="#contact">Contact</a></li>
</ul>
</div> <!--/.nav-collapse -->
</div>
</div>
如您所见,单击折叠的正方形时。它在导航栏“内部”花费。
我怎样才能让它像 bootstrap 网站上给出的例子一样扩展:
http://getbootstrap.com/examples/navbar-static-top/
编辑:
我遇到了同样的问题:在尝试了 Flopet17 所做的更改后(顺便说一句,谢谢),问题是由标题 div(第 3 行)中的“向左拉”类引起的。当我删除它时,它一切正常。
我想这个案子已经结案了。
最佳答案
只需将折叠菜单移到 .container
之外。
这是工作副本 --> JSFIDDLE
关于jquery - Bootstrap 导航栏未按预期扩展(在导航栏底部),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25977279/