导航栏不会移到右侧

时间:2019-01-08 21:54:06

标签: html css bootstrap-4

我的导航栏不会移到右侧。如您所见,我设置了div。但是,div仍然停留在导航栏的左侧。

<nav class="navbar navbar-expand-lg navbar-light bg-light">
  <a class="navbar-brand" href="#">BudLyfe</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarText" aria-controls="navbarText" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse" id="navbarText">
      <ul class="nav navbar-nav navbar-right">
        <% if (!user_signed_in?) %>
            <li><%= link_to "Login", new_user_session_path %></li>
            <li><%= link_to "Sign Up", new_user_registration_path %></li>
        <% else %>
        <li class="dropdown">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown"
                    role="button" aria-haspopup="true" aria-expanded="false">
                    <%= current_user.email %> <span class="caret"></span>
              </a>
              <ul class="dropdown-menu">
                <li><%= link_to "Edit Profile", edit_user_registration_path %></li>
                <li><%= link_to "Log out", destroy_user_session_path, method: :delete %></li>
              </ul>
          </li>
        <% end %>
      </ul>
    </div><!--/.nav-collapse -->
</nav>

1 个答案:

答案 0 :(得分:0)

引导4似乎使用实用程序类来分隔导航栏,而不是active = 1的引导3版本。将来,请确保您正在使用的特定引导版本的正确文档。

使用SELECT u.id, u.forename, u.surname, u.email, m.password, m.user_id, m.active, m.promotional_code FROM user u LEFT JOIN member m ON u.id = m.user_id WHERE u.active = 1 AND m.active = 1 AND m.group_id IN (26) AND (from_unixtime(m.end_date) > NOW() AND from_unixtime(m.end_date) < DATE_ADD(NOW(), INTERVAL 1 DAY)) AND NOT EXISTS ( SELECT 1 FROM ca_accounts c WHERE u.id = c.user_id AND c.active = 1 ) LIMIT 0, 25 代替navbar-right将列表推到导航栏的右侧。该ml-auto类代表navbar-right,这是您无需引导即可用于实现此效果的单个css规则。

示例代码笔在这里:https://codepen.io/anon/pen/QzBKPe