ブートストラップ：簡単なナビゲーションの整列問題

Question

画像のように、メインのトップナビゲーションの横にある「登録またはログイン」の部分を整列したいと思います。私は別のulを持つことができると思うが、おそらくそれを行う最良の方法ではない。

これは私がこれまで持っているものです。

<div class="navbar navbar-default navbar-fixed-top" role="navigation"> 
    <div class="container"> 
     <div class="navbar-header"> 
     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
      <span class="sr-only">Toggle Navigation</span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
     </button> 

     <a class="navbar-brand" href="#"> 
      <div class="logo"> 
      Logo 
      </div> 
     </a> 
     </div> 
     <div class="navbar-collapse collapse"> 
      <ul class="nav navbar-nav navbar-right"> 
      <li><a href="#">HOME</a></li> 
      <li><a href="#">ABOUT</a></li> 
      <li><a href="#">JOBS</a></li> 
      <li><a href="#">CANDIDATES</a></li> 
      <li><a href="#">CLIENTS</a></li> 
      <li><a href="#">CONTACT</a></li> 
      </ul> 
     </div> 
    </div> 
</div> 

あなたは、私がこれを行う推薦する方法は？あなたのUL内

Answer 1

最終的なLiがスパンを追加した後。その範囲内で、RegisterボタンとLOGINを追加することができます。これを実行すると、他のリスト項目とは区別されますが、折りたたまれます。画像にRegisterボタンのように見えるようにするには、ボタンにスタイリングを行う必要があり、スパンを垂直に揃える必要があります。