CSSで横メニュー作成

リストとCSSでメニューを作るときに横メニューにする方法。

よく使うのでメモ。

//CSS

#navi {
list-style: none;
}

#navi li {

float: left; //これを消すと縦メニュー

background: url(背景画像) no-repeat;

padding-left: 5px; //調整

margin-right: 5px; //調整

}

<ul id="navi">

<li>メニュー1</li>

<li>メニュー2</li>

</ul>