CSS 浮动在 Bootstrap 导航栏下方

Question

在我的 Rails 4 应用程序中，我无法正确设置菜单栏。具体来说，这两个 div 重叠。

我希望显示 "Register" 和 "Log in" 的块与左侧的菜单对齐，但向右浮动除外。我不希望它像这样漂浮在 Bootstrap 3 导航 div 下方：

当有人登录或注销时，这看起来特别不愉快：

"Register"或用户名和"Log in"或"Log out"的边栏在classnav pull-right中。在 bootstrap.css 中，相关的代码似乎是这样的：

.pull-right {
float: right !important;
}

这是我的 application.html.erb 代码的一部分：

<div class="navbar navbar-fixed-top">
<div class ="navbar-inner">
<div class="container">
<b><a href="#" class="brand">WHEELS Registration</a></b>
<ul class ="nav">
<%= link_to "All Events", events_path %>
</ul>
<ul class="nav pull-right">
    <% if user_signed_in? %>
    <li><%= link_to current_user.full_name, edit_user_registration_path %>  </li>
    <li><%= link_to "Log Out", logout_path %></li>
    <% else %>
      <li><%= link_to "Register", register_path %></li>
      <li><%= link_to "Log in", login_path %></li>
    <% end %>
  </ul>
  </div>
  </div>
</div>
<div class="container">
<% flash.each do |type, message| %>
   <div class = "alert <%= flash_class type.to_s %> ">
  <button class="close" data-dismiss="alert">x</button> 
  <%= message %>
 </div>
<% end %>

<%= yield %>
</div>

如果查看一下会有更多帮助，该应用程序就在这里：https://wheels-registration-yamilethmedina.c9.io/

（我没有在 Rails 上用 Ruby 标记这个因为它在技术上是一个 CSS 和 bootstrap 问题而且我不想阻塞那个标签，但如果您认为相关，我会添加）

Answer 1

尝试在包含 header 的另一部分的 div 中添加 pull-left class。类似的东西：

[...]
<div class="container">
    <div class="pull-left">
        <b><a href="#" class="brand">WHEELS Registration</a></b>
        <ul class ="nav">
        <%= link_to "All Events", events_path %>
        </ul>
    </div>
    <ul class="nav pull-right">
        [...]

CSS 浮动在 Bootstrap 导航栏下方

CSS float is below Bootstrap nav bar

css

twitter-bootstrap

twitter-bootstrap-3