JSFiddle - React, Tailwind, and code Playground

HTML

<div id="menu">
  <ul>
    <li>
      <a href="javascript: void(0)">Lalalalal</a>
      <ul>
        <li>
          <a href="javascript: void(0)"><span>Link 1</span></a>
          <a href="javascript: void(0)"><span>Link 2</span></a>
          <a href="javascript: void(0)"><span>Link 3</span></a>
        </li>
      </ul>
    </li>
  </ul>
</div>

CSS

#menu ul li {
  
  position: relative;  
  
  background-color: yellow;
}

#menu ul li ul {
    
   position: absolute; 
   top: 0px;
   left: 0px;
   padding: 20px;
   
   width: 100%;
   height: 100%;
   
  
   display: none;
   visibility: hidden;
}

#menu ul li:active > ul{
  
   display: block;
   visibility: visible;  
}

#menu ul li ul:hover {
 
   display: block;
   visibility: visible; 
   
   background-color: green;
}