CSS 下拉菜单未正确对齐

【问题标题】：CSS DropDown Menu Not Aligned CorrectlyCSS 下拉菜单未正确对齐
【发布时间】：2012-04-30 11:33:17
【问题描述】：

我为客户开发了http://pizzli.com/millington，并仅使用 CSS 作为下拉菜单。结果很好，但是由于某种原因它们向右对齐。看看下面的图片。任何帮助将不胜感激。

【问题讨论】：

子菜单实际上与中心对齐，只需测试更改您的 text-align:left ，您就会看到，您的规则搞砸了我建议您为子菜单制定自己的规则，这是因为父元素填充你的中心移动

【解决方案1】：

嘿，我希望你的下拉导航从左开始，而不是你给你的 li 位置相对和 sub ul 给左和绝对属性，就像这样

对您的 css 文件进行一些更改

#navigation li {
    float: left;
    list-style: none outside none;
    position: relative;
}

还有这个

#navigation li:hover ul {
    display: block;
    left: -16px;
    margin: 0;
    padding: 0;
    position: absolute;
}

【讨论】：

【解决方案2】：

尝试创建left: inherit;，然后使用margin-left: xyz; 来相对于父元素定位元素。
请注意，您可能必须将 left: 和 margin-left: 更改为 right: 和 margin-right:，但这对我来说非常有用，我花了很长时间才弄清楚。

【讨论】：