JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li>
        <a href="#">Link</a>
        <ul>
            <li><a href="#">Link</a></li>
            <li><a href="#">Link</a></li>
            <li><a href="#">Link</a></li>
            <li><a href="#">Link</a></li>
        </ul>
    </li>
    <li>
        <a href="#">Link</a>
        <ul>
            <li><a href="#">Link</a></li>
            <li><a href="#">Link</a></li>
            <li><a href="#">Link</a></li>
            <li><a href="#">Link</a></li>
        </ul>
    </li>
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
</ul>

CSS

ul { list-style: none; }
ul li { position: relative; width: 100px; }
ul li > a { display: block; padding: 5px; background: #f0f0f0; }
ul li ul { position: absolute; display: none; left: 100px; top: 0px; } 
ul li:hover ul { display: block; }