我已经在CSS中创建了一个水平下拉菜单，但是当我将其悬停时，下拉部分位于该部分的“下方”，所以我试图找出如何使下拉菜单越过该部分
header{
width:80%;
background-color:black;
margin-left:auto;
margin-right:auto;
padding:10px;
overflow:hidden;
}
#navMenu {
margin:0;
padding:0;
width:80%
}
#navMenu ul{
margin:0;
padding:0;
line-height:30px;
}
#navMenu li{
margin:0;
padding:0;
list-style:none;
float:left;
position:relative;
}
#navMenu ul li a {
text-align:center;
text-decoration:none;
height:30px;
width:150px;
display:block;
color:white;
}
#navMenu ul ul {
position:absolute;
visibility:hidden;
top:30px;
}
#navMenu ul li:hover ul{
visibility:visible;
background-color:#333333;
}
section {
width:80%;
background-color:#b5b5b5;
margin-right:auto;
margin-left:auto;
border-color:black;
border-style:solid;
border-width:5px;
padding:5px;
}<body>
<header>
<div id="wrapper">
<div id="navMenu">
<ul>
<li><a href="progetto2.html">MUSIC</a>
<ul>
<li><a href="#">link</a></li>
<li><a href="#">link</a></li>
<li><a href="#">link</a></li>
</ul>
</li>
</ul>
</div>
</div>
</header>
<section>
</section>
</body>我对此不太实用，所以我不知道该怎么做才能使下拉菜单越过部分
子菜单出现在
headeroverflow: hidden您可以尝试以下方法：
header{
display: flex;
width:80%;
background-color:black;
margin-inline: auto;
padding:10px;
}
如果您希望
<div id="wrapper>flex: 1flex-grow: 1; flex-shrink: 1; flex-basis: 0%;请注意，您也可以使用
display: grid