背景色が

Question

がどのように私は、背景色の高さは、リンクとほぼ同じ高さに削減するテキストやリンクと同じ高さと幅であることを、私はCSSで高さを利用しようとしたが、それは動作しませんでした

CSS

.login { 

    color: #4CAF50; 
    background-color: #a0ce4e; 

} 

.login a { 
    cursor: pointer; 
    display: inline-block; 
    background: #a0ce4e; 
    border-radius: 1px; 
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); 
    padding: 10px 15px; 
    color: #ffffff; 
    text-decoration: none; 
    -webkit-transition: 0.3s ease; 
    transition: 0.3s ease; 
} 
.login a:hover { 
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23); 
} 

HTML

<div class="login"> 
      <ul class="nav navbar-nav"> 
       <li class="active"> 
        <a class="page-scroll" href="#">Login</a> 

       </li> 
      </ul> 
     </div> 

Answer 1

削除パディング：

.login a { 
    padding: 0px; /* or 1.. */ 
} 

Answer 2

ものは、ブートストラップクラスのように見えるので、私はあなたがそうナビゲーションバー-NAVからパディングおよび/または余白を削除する必要がありますと言うでしょう。

独自のクラスを追加し、それを使って上書きスタイルを追加することで、これを行うことができます。たとえば、次のように

CSS：

.navbar-nav.navbar-nospace { 
    margin: 0px; 
    padding: 0px; 
} 

HTML：

<ul class="nav navbar-nav navbar-nospace">