如何在ul内集中导航？

Question

我试图将导航放在这个页面的顶部：http://www.escalatehosting.com/cloud-hosting.php

<div class="menu" style="text-align: center;">
<ul id="treemenu1" style="width:1000px;display: inline-block;margin: 0;padding: 0;zoom:1;*display: inline;">
<li><a href="http://www.escalatehosting.com/website-hosting.php" id="inactive">Website Hosting</a></li>
<li><a href="http://www.escalatehosting.com/cloud-hosting.php" id="inactive">Cloud Hosting</a></li>
<li><a href="http://www.escalatehosting.com/reseller-hosting.php" id="inactive">Reseller Hosting</a></li>
<li><a href="http://www.escalatehosting.com/virtual-hosting.php" id="inactive">Virtual Servers</a></li>
<li><a href="http://www.escalatehosting.com/dedicated-servers.php" id="inactive">Dedicated Servers</a>  </li>
<li><a href="http://www.escalatehosting.com/affiliate-program.php" id="inactive">Affiliate Program</a></li>
<li class="last">&nbsp;</li>
</ul>
</div>

有人看到需要修理的东西了吗？我敢肯定这是件愚蠢的事，我总是忽略它，但似乎找不到它。

Answer 1

将id="inactive"更改为class"inactive"以使其语义正确。然后，将所有样式放在css中，而不是内联，因为内联将始终覆盖您的外部css。

检查一下这个DEMO，你只需要照顾#treemenu1

CSS

.menu {
    width:98%;
    margin: 0 auto;
    text-align:center;
    border:1px solid #000;
}
.menu > #treemenu1 {
    width:30%;
    text-align:left;
    margin: 0 auto;
    border:1px solid #CCC;
}

Answer 2

试试这个：

.menu{
margin:0 auto;
width: 98%;
}

我认为您希望整个菜单的中心位置，而不是每个菜单的文本，因为它已经居中。是你想要的吗？希望这能有所帮助。