css导航栏下拉菜单乱

最近我在写网页的时候，遇到了一个让我很不爽的问题，就是导航栏下拉菜单乱跳的问题。

本来我的导航栏是一个很简单的横向菜单，但是当我加入了下拉菜单后，就发现鼠标移到菜单上，下拉菜单的位置会跳来跳去，而且有时候显示不正常。

一开始我以为是代码问题，于是我仔细地检查了一遍，但是没有发现问题。于是我开始用浏览器的开发者工具查看样式，发现下拉菜单的定位属性设置了相对布局，但是没有设置上下左右的具体数值。

nav ul li ul {
   position: relative;
}

后来我尝试给下拉菜单增加了top和left属性，使其固定在父菜单的下方，但是依然没有解决问题，下拉菜单还是乱跳。

nav ul li ul {
   position: absolute;
   top: 100%;
   left: 0;
}

最后，在经过一番尝试之后，我终于找到了问题的原因。原来是由于我的导航栏嵌套了多个div，而这些div之间的宽度没有设置好导致的。于是我对导航栏进行了一些微小的调整，所有的菜单都处于同一层级，而且现在菜单下拉的位置也是正常的了。

总的来说，这个问题并不是很大，但是它让我更加了解了css的定位属性以及样式的层级关系。