[CSS]フロートしたナビゲーションを中央に配置するスタイルシート

リスト要素をフロートさせて作成したナビゲーションをブラウザの中央に配置するスタイルシートをCSSplayから紹介します。

ナビゲーションのwidthは指定無しの成り行きです。

Centering Float Left Menus

デモでは、CSSハックやinline-block, table/table-cellを使用せずに実装されています。

下記に、それをシンプルにしたデモをアップしました。
シンプルにしたデモ

IE6/7/8beta2, Fx3, Op9.5, Safari3, Chrome1で正常に動作しました。IE5.5, Fx2はダメでした。

追記：その1

リストを内包するdivに「text-align:center;」をしたら、上記ブラウザ＋Fx2に対応できました。
なんで、きくのだろう、、、？
シンプルにしたデモ（Fx2対応）

追記：その2

「ふ」さんのコメントにより、Safari3で横スクロールが出る現象を回避するため、divに「overflow:hidden;」をしました。上記のデモに上書きです。
参考：Centred Floats