Javascript 以悬停工具提示样式子导航为中心是'；行不通

正如你在这里看到的，当鼠标悬停在主导航中的“whats new”或“accessories”上时，工具提示样式的子导航下拉列表将完美居中。但是，当您将鼠标悬停在“衣服”上时，它不会居中

我已经尝试过重新定位，但是在不破坏其他两个的情况下，它对导航“衣服”不起作用

有更好的解决方案或修复方案吗

---

谢谢大家!

使用以下CSS很容易实现这一点

#top-menu ul ul {
    margin-left: -87.5px;
    left: 50%;
    }

我们使用了87.5px的负余量，因为你的UL宽度是175px，从而给了我们一半的UL宽度，然后把它移到左边50%，这样它就在你Li的锚标签的中间。

---

我希望这是有道理的。任何问题都会留下评论，我会回复您。

实际上，子菜单居中显示“最新内容”和“附件”只是巧合，但它们实际上看起来居中。问题是您做得不对，为内部子菜单定义了一个固定为

-31px

的

左

样式位置

但是，由于这些子菜单具有固定的宽度，您可以使用一个老技巧依赖它：

#top-menu ul ul {
    left: 50%;
    margin-left: -88px;
}

---

这会将子菜单移到

元素的中心，然后移回其大小的一半（或多或少）的左侧。

谢谢@trickeedickee，但是，现在悬停例如：什么是新功能，子导航将显示在衣服下，当悬停在衣服上时，子导航将显示在附件下。。诸如此类：（谢谢@Maxart..正如对上述答案的评论，现在悬停例如：什么是新的，子导航将显示在衣服下，当悬停在衣服上时，子导航将显示在附件下..等等：(