一個自動居中的導航條實例與相關問題 DIV+CSS_CSS/HTML

這是我剛剛作的一個導航條，為了讓那四個LINK居中，我這樣作了，但作完後發現了很多的問題，寫出來和大家分享一下！

首先我們先來看看這個導航條！

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>test zishu</title> <style> /*zishu.cn*/ *{ margin:0; padding:0;} body{ font-size:12px; font-family:Verdana, "宋体", Arial; margin:100px 0;} a:link,a:visited{color:#000; text-decoration: none;} a:hover,a:active{color:#000;text-decoration: none;background-color: #FEFC6E;} #nav{height:24px; border-bottom:1px solid #D28A05; border-top:1px solid #D28A05;background-image: url(http://www.zishu.cn/attachments/month_0609/j2006912180.jpg);background-color: #FF9900; text-align:center;} #nav li{ display:inline;border-right:1px solid #C97802;border-left:1px solid #C97802;margin-right:-1px; padding:6px 15px 5px 15px; line-height:25px; border-bottom:0px none; border-top:0px none;} #nav li a{margin:1px;} p{ margin:50px 0; text-align:center; } </style> <div id="nav"> <ul> <li><a href="http://www.kijiji.cn" target="_blank">首頁</a></li> <li><a href="http://www.kijiji.cn/fabu" target="_blank">發佈資訊</a></li> <li><a href="http://www.kijiji.cn/wo/xxgl" title="在这里可以管理已经发布的信息和个人资料" target="_blank">我的客齊集</a></li> <li><a href="http://blog.kijiji.com.cn/help/" target="_blank">幫助</a></li> </ul> </div> <p><a href="http://www.zishu.cn" target="_blank">www.zishu.cn 子鼠</a> 2006-09-11 凌晨</p>
[Ctrl+A 全選註:如需引入外部Js需刷新才能執行]

問題：
1、空格BUG出現我FIREFOX中，不知道為什麼，如果把LI分不寫在同一行，問題就出來了，你可以在上邊運行程式碼中試試看！

2、IE和FIREFOX的微小區別（看下圖），如果你沒有發現這小小的區別，你就不會在CSS中寫成padding:6px 15px 5px 15px;  也就永遠不會把中間的垂直線和上下兩條線連在一起！ （這其中IE6和IE7還有更微小的差別）；


3、#nav li a{margin:1px;}這行是不是沒有用？如果你這樣認為你就刪了試一下，看行不行！

4、頁面在縮放到一定小時會折行，FIREFOX中用min-width解決，而IE中min-width不認識，所以只有用：expression((documentElement.clientWidt.....來解決了！

程式碼如下:#nav{height:24px; border-bottom:1px solid #D28A05; border-top:1pxDvid url(nav_bg.jpg);background-color: #FF9900; text-align:center;min-width:400px;width: expression((documentElement.clientWidth 基本上就這行多問題，建議自已作一下，這樣你會發現特別多的問題！吧！