Igo*_*pov 19 html css twitter-bootstrap-3
在我的网页中,我有一个Bootstrap 3导航栏:
<body>
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="navbar-header">
<a class="navbar-brand" href="#">Teachlab</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li><%= link_to "Home", '#' %></li>
<li><%= link_to "Help", '#' %></li>
<li><%= link_to "Sign in", '#' %></li>
</ul>
</div>
</nav>
<div class="container">
<%= yield %>
</div>
</body>
问题是导航是靠近屏幕的边缘.如果我从导航栏中删除navbar-fixed-top,它可以正常工作.
任何提示？
Chr*_*ina 15
从3.1.1开始使用.container-fluid.
结构不正确..navbar-right在.collapse容器上不在ul上.
示例:http://jsbin.com/eQIROsE/2/edit
<div class="navbar navbar-fixed-top navbar-default">
<div class="navbar-header">
<a class="navbar-brand" href="#">Project name</a>
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="navbar-collapse collapse navbar-right">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a>
</li>
<li><a href="#about">About</a>
</li>
<li><a href="#contact">Contact</a>
</li>
</ul>
</div>
<!--/.navbar-collapse -->
</div>
Igo*_*pov 13
我最终压倒了以下内容:
.navbar-nav.navbar-right:last-child {
margin-right: 0;
}
但也许有另一种解决方案？