當我試着從我的主導航欄添加dropdwon列表，我的主導航欄alighment被改變

Question

enter image description here 我的主菜單中去，當我加入下拉值

Answer 1

我承擔主菜單應是水平的。下面的解決方案顯示主菜單選項懸停的子菜單。

ul { 
 
    padding: 0; 
 
    margin: 0; 
 
    list-style: none; 
 
} 
 

 
nav>ul { 
 
    display: flex; 
 
} 
 

 
nav>ul>li { 
 
    padding: 1em; 
 
} 
 

 
nav>ul>li>ul { 
 
    display: none; 
 
} 
 

 
nav>ul>li:hover>ul { 
 
    display: block; 
 
}

<nav class="tm-nav"> 
 
    <ul> 
 
    <li><a href="#">Home</a></li> 
 
    <li><a href="#">About me</a></li> 
 
    <li><a href="#">Technologies</a> 
 
     <ul> 
 
     <li><a href="#">Testing1</a></li> 
 
     </ul> 
 
     <ul> 
 
     <li><a href="#">Testing2</a></li> 
 
     </ul> 
 
     <ul> 
 
     <li><a href="#">Testing3</a></li> 
 
     </ul> 
 
    </li> 
 
    <li><a href="#">Contact me</a></li> 
 
    </ul> 
 
</nav>