Html css下拉菜单位置错误

我对纯css下拉菜单的定位有问题。您可以在以下网址找到该网站：

当你将鼠标悬停在“教程”（我不是真的在做任何事情，但它是为了学习）和“博客”上时，你会看到下拉菜单的位置不在选项卡的正下方，而是移到了右边

---

如何将下拉菜单放置在选项卡下？提前感谢您的帮助。

您需要为元素上的

边距

、

填充等重置浏览器默认值

在CSS的顶部，您至少可以执行以下操作：

html，body，ul，li，p{margin:0；padding:0}

查找更多选项。
之所以会出现这种情况，是因为您的浏览器会自动将自定义CSS添加到某些元素中，如本例中的“ul”标记。
我正在使用Chrome，我在所有子列表中都看到了这种风格：-webkit padding start:40px；
因此，只需添加以下css：

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

尝试编辑文件“main.css”，更改以下内容：

ul#nav li ul{
position:absolute;
display:none;
}

为此：

ul#nav li ul{
position:absolute;
display:none;
padding:0;
margin:0;
}

我认为这会解决你的职位问题。
这些样式是chrome inspector自己的用户代理样式。是的。并由浏览器将其定义为默认值。它们可以被类似于上述代码的样式覆盖。没有理由进行此否决表决。不建议重置。浏览器默认值相当一致，应该根据需要逐个覆盖，而不是大多数重置所采用的“散弹枪”方法。这被称为“标准化”。