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

试试这个：

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

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

Answer 2

将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;
}

如何在ul内导航？

2 个答案: