Html nav的父列表项下的子项

我有一个下拉菜单，我已经做了，但下拉菜单不下拉下他们的父项

我的代码可以看到

我认为这可能与代码的这一部分有关：

nav ul li ul {
position: absolute;
height: auto;
background-color: #f2f2f2;
}

---

但我不太确定，所以任何帮助都将不胜感激

只需将

position:relative

添加到

nav>ul li

，即可确保绝对定位的子菜单相对于它们是子菜单的列表项而不是父菜单本身定位

---

*需要注意的是，相对于父项定位的子项与设置为

相对的父项位置无关，只有父项定义了定位。
只需将
位置：相对
添加到
导航>ul li
，这确保了绝对定位的子菜单相对于它们是子菜单的列表项而不是父菜单本身来定位它们自己

*需要注意的是，相对于父项定位的子项与设置为
相对的父项位置无关，只有父项定义了定位。
您需要相对定位父项
Li

nav > ul li {
    list-style-type: none;
    display: inline;
    vertical-align: top;
    height: 40px;
    line-height: 40px;
    padding: 10px 15px;
    border-right: 2px solid #e6e7e9;
    margin: -2px;
    position: relative; /* Add this */
}

您需要相对定位父级
Li

nav > ul li {
    list-style-type: none;
    display: inline;
    vertical-align: top;
    height: 40px;
    line-height: 40px;
    padding: 10px 15px;
    border-right: 2px solid #e6e7e9;
    margin: -2px;
    position: relative; /* Add this */
}

试试看

nav li {
    display: inline;
    position: relative;
}

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

试一试

刚刚注意到。。。这只适用于chrome。。firefox和IE仍然在第一个导航项下显示它…刚刚注意到。。。这只适用于chrome。。firefox和IE仍然在第一个导航项下显示它…刚刚注意到。。。这只适用于chrome。。firefox和IE仍然在第一个导航项下显示它…刚刚注意到。。。这只适用于chrome。。firefox和IE仍然在第一个导航项下显示它。。。