解 説

ナビゲーションをliで作成して、floatを使用して横並びにする方法はよく使用されます。
面倒なのは横並びのliを中央に揃えることです。

liをfloatして横並びにした例
htmlコード

cssコード

中央揃えする方法

floatしたliを中央揃えにするにはulとliにposition:relativeを設定して、ulの座標をleft:50%とし、liの座標をleft:-50%とします。
Tipsとして知っておくと便利です。

liをfloatして横並びにした後に中央揃えの例
htmlコード

cssコード