css - 元素符号列表项总是缩进 1.8em 吗？

Question

我制作了一个仅使用 CSS 的下拉菜单。要求是有一个水平的元素条，每个元素都可以下拉一个垂直菜单。此外，这些元素不应删除三级菜单，而应仅显示元素符号列表。我的 html 有三个嵌套的 ul 并且菜单在所有现代浏览器中都能正常工作。它看起来像这样:

但是，我不喜欢链接后面的深色框是如何从元素符号的右侧开始的，并且不会延伸到整个菜单宽度，所以我试了一下，最后做出了这个调整:

#nav li ul li ul li a {
    padding-left:1.8em;
    margin-left:-1.8em;
}

现在带元素符号的菜单项看起来就像我想要的那样:

并且由于 em 与字体大小相关的性质，它独立于字体大小工作，如此处显示的较大字体大小:

我在 Internet Explorer 8+9+10(开发者预览版)、Firefox 3+7、最新的 Chrome、Opera 和 Safari 上对此进行了测试，效果非常好。

但是，我只是不明白为什么它恰好是 1.8em 来完成这项工作。为什么每个浏览器都将元素符号项缩进这么远？我在互联网上搜索了这个主题，但没有找到任何有用的信息。我可以确定这适用于 future 的浏览器吗？那些 1.8em 是在 HTML 标准中指定的吗？

提前感谢您的任何提示!

编辑:

收件人DisgruntledGoat's答:用1em/-1em或者20px/-20px都不行。使用这种风格:

#nav li ul li ul li a {
    padding-left:20px;
    margin-left:-20px;
}

对于不同的字体大小，我得到了这个(显然不随字体大小缩放)结果:

同样，1em/-1em 也关闭，看起来像上图中的右侧，但随着字体大小缩放。出于某种原因，看起来 1.8em 仍然是神奇的距离......

Answer 1

根据您的代码，您已经设置了 ul，使其没有边距或填充。但是，您已将 li 设置为 margin-left: 1.8em:

#nav li ul li ul li {
    display: list-item;
    margin-left:1.8em;
    list-style:disc outside none;
}

#nav li ul li ul li {
    margin-left: 1.8em;
    padding-left: 0;
}

就是这样。