时间戳

首页 > 解决方案 > Bootstrap 导航栏项目未向右对齐

css - Bootstrap 导航栏项目未向右对齐

问题描述

我正在尝试对齐 div 中的两个按钮以对齐。但目前，当我试图向右对齐时，它会移动到中间。

<nav class="navbar navbar-light navbar-expand bg-light navigation-clean">
        <div class="container"><a class="navbar-brand" href="#">Brand</a><button data-toggle="collapse" class="navbar-toggler" data-target="#navcol-1"></button>
            <div class="collapse navbar-collapse" id="navcol-1"><a class="btn btn-primary ml-auto" role="button" href="#">Sign Up</a></div>
            <div class="collapse navbar-collapse" id="navcol-2"><a class="btn btn-primary ml-auto" role="button" href="#">Sign Up</a></div>
        </div>
    </nav>

在此处输入图像描述

标签： csstwitter-bootstrap

解决方案

尝试这个

<nav class="navbar navbar-light navbar-expand bg-light navigation-clean">
  <div class="container">
    <a class="navbar-brand" href="#">Brand</a>
    <button data-toggle="collapse" class="navbar-toggler" data-target="#navcol-1"></button>
    <div class="collapse navbar-collapse" id="navcol-1">
      <a class="btn btn-primary ml-auto" role="button" href="#">Sign Up</a>
      <a class="btn btn-primary ml-2" role="button" href="#">Sign Up</a>
    </div>
  </div>
</nav>

推荐阅读