Question

我的来源看起来像这样

<div class="navbar">
  <div class="navbar-inner">
    <div class="container">
      <ul class="nav">
        <a class="brand" href="#">Project name</a>

        <li><%= link_to 'Home', pages_home_path %></li>

        <li><%= link_to 'About', pages_about_path %></li>

        <li><%= link_to 'Contact Us', pages_contact_path %></li>




        <li class="nav pull-right">   
          <div id="user_nav">
            <% if user_signed_in? %>
            Signed in as <%= current_user.email %>. Not you?
            <%= link_to "Sign out", destroy_user_session_path, :method => :delete, :class => 'btn btn-danger btn-mini' %>
            <% else %>
            <%= link_to new_user_registration_path do %>
            <button class="btn-mini btn btn-info">Sign Up</button>
            <% end %>
            or <%= link_to new_user_session_path do %>
            <button class="btn btn-info btn-mini">Sign In</button>
            <% end %>
            <% end %>
          </div>
        </li>

      </ul>
    </div>
  </div>
</div>

我在我的用户登录/退出部分使用.pull-right但它只是向右移动了一点，但没有向最右边移动，正如您在twitter-bootstrap原始页面中看到的那样。请让我知道我做错了什么。

Answer 1

尝试这种方式：

<div class="navbar">
  <div class="navbar-inner">
    <div class="container">
      <ul class="nav">
        <a class="brand" href="#">Project name</a>

        <li><%= link_to 'Home', pages_home_path %></li>

        <li><%= link_to 'About', pages_about_path %></li>

        <li><%= link_to 'Contact Us', pages_contact_path %></li>
      </ul>



      <ul class="nav pull-right">   
        <li>
          <div id="user_nav">
            <% if user_signed_in? %>
            Signed in as <%= current_user.email %>. Not you?
            <%= link_to "Sign out", destroy_user_session_path, :method => :delete, :class => 'btn btn-danger btn-mini' %>
            <% else %>
            <%= link_to new_user_registration_path do %>
            <button class="btn-mini btn btn-info">Sign Up</button>
            <% end %>
            or <%= link_to new_user_session_path do %>
            <button class="btn btn-info btn-mini">Sign In</button>
            <% end %>
            <% end %>
          </div>
        </li> 
      </ul>

    </div>
  </div>
</div>

如何使登录/注册按钮浮动在引导程序上

1 个答案: