css - BootstrapNavbarのリンクハイライト領域のサイズを変更する

Question

Twitter Bootstrapを使用して、ページの中央にナビゲーションバーを作成しました。3つのアイコンを中央に離して配置しました。それらの1つにカーソルを合わせると、強調表示された部分の中央にテキストが表示されません。以下のようになります。ホームまたはタグを強調表示された部分のちょうど中央に配置したい。

これが私の小さな関連コードです。

.navbar .nav > li > a 
{
 float: none ;
 padding: 10px 100px 8px 0px ;
 color: #777777 ;
 text-decoration: none ;
 text-shadow: 0 1px 0 #444 ;
 font-size:20px ;
}


.navbar .nav > li > a:focus,
.navbar .nav > li > a:hover 
{
  color: silver ;
  text-decoration: none ;
  background-color:ThreeDFace  #444 ;   
}

Answer 1

これがあなたを助けることを願っています!!

この CSS スタイルを変更する

.navbar .nav > li > a 
{
 float: none ;
 padding: 10px 100px 8px 0px ;
 color: #777777 ;
 text-decoration: none ;
 text-shadow: 0 1px 0 #444 ;
 font-size:20px ;
}

これに

.navbar .nav > li > a 
{
 float: none ;
 width: 100px; 
 text-align: center;
 color: #777777 ;
 text-decoration: none ;
 text-shadow: 0 1px 0 #444 ;
 font-size:20px ;
}

そして完了:)