菜单无法正确对齐

Question

我有一个CSS菜单，我需要孩子们与父菜单对齐。我似乎无法做到这一点。我尝试了几件事，但菜单不会以div为中心。

它看起来如何：

这是代码： http://jsfiddle.net/V95wJ/

Answer 1

你正在使用

text-align:center;

对于您的父菜单，子项无法与CSS对齐父项。也许和js一样，但即便如此，我认为这不可能。

我认为你必须亲自为每个儿童菜单做这件事。

Answer 2

CSS中的ul.nice-menu li ul li a样式可以在左侧使用一些填充/边距添加。 快速测试显示将此元素的填充设置为：

padding: 0;
padding-left: 20px;

...并添加

  margin-top: -10px;

到ul.nice-menu li ul会使菜单和子菜单的顶部和底部整齐地触摸。

应该大致给出你想要的东西。

注意，我在Chrome中测试过。

---

编辑：正如Jerska所指出的，您的顶级菜单项是居中的，这意味着对齐子菜单中的文本不会起作用（至少不容易，没有太多调整，然后可能是不会为所有浏览器工作。）

我离开了我的回答，因为它可能有助于指出正确的方向，例如，左对齐的菜单项。