html - ロールアウト ナビゲーション メニュー - バックグラウンド CSS の問題

Question

ライブサイト。

ロールアウト ナビゲーション メニューがあり、(理想的には) ボタンの最初のセットがどちらかの側にある必要が20pxあり#000104ます。「概要」と「プロパティ」にカーソルを合わせると#000104、拡張オプションの後ろでロールアウトが続行されます。

ただし、ボタンの最初のセットのサイズを制限するのに問題があります。これを行う最善の方法は何ですか？（私の主な問題は、各ボタンの長さが異なることです-About、Blog、Contact、Properties。背景色を動的にサイズ変更するにはどうすればよいですか？）

jsfiddle。

Answer 1

タグではなく、タグで使用background: #000104したい。そうすれば、色は順序付けされていないリストの幅全体に広がることはありません。テキストまでしか拡張されません。さらに、ボタンを両側にさらに伸ばすには、左側と右側に20pxを追加します。aulapadding

nav ul li a {
    background: #000104;
    padding-left: 20px;
    padding-right: 20px;
}

JSフィドルの例