懸停時不出現下拉菜單

Question

我試圖弄清楚為什么我在右側insnt上的下拉菜單在懸停時會起作用。 它可能真的很簡單，我錯過了，我顯然很想念它。 :vanish.hover.dropdown 似乎沒有達到目的..？我做錯了什么？

https://plnkr.co/edit/Cnh6G1cGE1v4zCnuftgy?p=preview

.vanish:hover .dropdown {
   display: flex;
   flex-direction: column;
   position: absolute;
   left: -10px;
   top: -10px;
   background-color: #dcf1f2;
   border-radius: 10px;
}

Answer 1

您需要移動li下的ul.dropdown ：

<li class="vanish">
  <span>Account</span>
  <ul class="dropdown">
    <li><a href="#">Login</a></li>
    <li><a href="#">Sign Up</a></li>
  </ul>
</li>

一旦我這樣做了，在 hover 上它就會正確顯示下拉列表。 （你還有一個額外的li標簽）

Plunker： https://next.plnkr.co/edit/leakntv0F7pMpnWL