Bootstrap 4将导航栏项目向右对齐

如何将导航栏项目右对齐？

我要登录并在右边注册。但是我尝试的所有方法似乎都无法正常工作。

到目前为止，这是我尝试过的：

<div>周围<ul>带有属性：style="float: right"
<div>周围<ul>带有属性：style="text-align: right"
在<li>标签上尝试了这两件事
再次尝试了所有这些事情，并!important添加到最后
改变nav-item以nav-right在<li>
添加了一个pull-sm-right类的<li>
添加了一个align-content-end类的<li>

这是我的代码：

<div id="app" class="container">
  <nav class="navbar navbar-toggleable-md navbar-light bg-faded">
    <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
    </button>
    <a class="navbar-brand" href="#">Navbar</a>
    <ul class="navbar-nav">
      <li class="nav-item active">
        <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Features</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Pricingg</a>
      </li>
    </ul>
    <ul class="navbar-nav " >
      <li  class="nav-item">
        <a class="nav-link" href="{{ url('/login') }}">Login</a>
      </li>
      <li  class="nav-item">
        <a class="nav-link" href="{{ url('/register') }}">Register</a>
      </li>
    </ul>
  </nav>
  @yield('content')
</div>