ラインの高さや詰め物を使用せずに、ナビゲーションのアイテムの垂直の中心をナビゲーションバーに合わせる方法

Question

ラインの高さや詰め物を使わずに、liタグを垂直方向のナビゲーションバーの中心に垂直に揃えようとしています。

ここに私のコードです。

<header> 
    <nav class="navbar navbar-default nav-main"> 
    <div class="container-fluid"> 
<!-- small size devices collapse button --> 
     <div class="navbar-header"> 
     <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#mobile-menu-expand" aria-expanded="false"> 
      <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 nav-brand" href="#"><img src="asset/images/main-logo.png" alt=""></a> 
     </div> <!--end of navbar-header --> 

<!-- medium size devices menu --> 
     <div class="collapse navbar-collapse" id="mobile-menu-expand"> 
     <ul class="nav navbar-nav navbar-right"> 
      <li><a href="#">work</a></li> 
      <li><a href="#">services</a></li> 
      <li><a href="#">About</a></li> 
      <li><button type="button" class="btn btn-default navbar-btn">contact</button></li> 
     </ul> 
     </div><!-- /.navbar-collapse --> 
    </div><!-- /.container-fluid --> 
    </nav> 
</header> 

Answer 1

だけCSSにlineheightで

.navbar li 
{ 
    lineheight:20px; 
} 

増加を扱うか、あなたの高さに応じlineheight減少。