如何修复Wordpress（二十一）CSS菜单对齐？

Question

专家

我很难调整菜单的CSS部分。

我在http://aaron.wordpresstiger.com有一个网站，其中菜单的最后一个标题“CONTACT”出现了前面一行并且不适合菜单。虽然我成功地使“HOME”第一个菜单项正确地适合菜单而不是最后一个菜单项。

你能告诉我我应该添加什么CSS来解决这个菜单问题。此外，请看看我需要菜单的最后一项显示与第一项（HOME）相同的CSS。

我需要菜单的项目看起来类似于这里的项目： http://officialfacebooklikes.com/index.html（查看最后一个适合菜单的“联系人”）。

我期待听到帮助回复：）

此致 Muzammil Rafiq

Answer 1

在你的CSS中你会想要添加两个样式

#access li {
    width: 25%;
}

#access li:last-of-type, li#menu-item-31{
    border-right: none !important;
    width:24% !important;
}

第一个将使每个菜单元素占宽度的四分之一...第二个将删除最后一个元素的右边框并重新调整大小以适合导航栏的一行。

！important标签可能没有必要，但它们将确保首先使用。

Answer 2

好吧，如果你想创建一个水平菜单，你应该浮动列表项。但是正如我在您的示例网站上看到的那样，您希望列表项的宽度均匀，因此您需要将这些列表项放入容器中，确定每个列表容器的宽度并浮动它们。文本对齐也可以使您的标签居中。

祝你好运！