武林網(www.survivalescaperooms.com)文章簡介：昨天用ucweb看到了goos發的一篇帖子：誰說Float菜單不可以水平居中，進去看了看，覺得方法有點繁瑣了，用到了負邊距，position:relativel; 和很少的一點hack。

昨天用ucweb看到了goos發的一篇帖子：誰說Float菜單不可以水平居中，進去看了看，覺得方法有點繁瑣了，用到了負邊距，position:relativel; 和很少的一點hack。

我這里還有更簡單的辦法，先展示：
其實我外面應該再套一個div，但為了減少碳排放，舍棄。

運行代碼框

[Ctrl+A 全部選擇 提示：你可先修改部分代碼，再按運行]

其中最為關鍵的是這一句：

<!--[if lte IE 7]><style type="text/css">#navigation{display:inline;}</style><![endif]-->

為了照顧較低版本IE，這里使用了條件注釋，感覺在IE7以下中，display:inline;的作用就相當于inline-block;。

根據上面代碼進化而來的滑動門導航：

運行代碼框

[Ctrl+A 全部選擇 提示：你可先修改部分代碼，再按運行]

其中，這兩句有必要說明一下，以免被認為是多余的：

#navigation li a{overflow:hidden;} /* 隱藏掉IE5.5、6多掉的那3px，不是3px bug哈！因為height:30px;line-height:33px; 在IE5.5、6中高度就是33px了。  */
#navigation li a span{cursor:hand;}/* 照顧IE 5.5、6、7鼠標放在span上面不呈手型的bug。此外，IE5.5不支持cursor:pointer;但IE全版本都認識cursor:hand;*/

完工了，缺點就是，寫那一行條件注釋，對于有xhtml潔癖的人來說，就像眼里的沙子，想除掉，那就使用hack也無妨！呵呵！

在safari4，chorme，opera10，ie5.5、5、6、7,ff3中均暫未發現問題。