JSFiddle - React, Tailwind, and code Playground

by TheNix

HTML

<nav>
    <ul class="menu">
        <li class="menu-item">
            hej
            <ul class="submenu">
                <li class="submenu-item">Banban</li>
                <li class="submenu-item">Voioi</li>
                <li class="submenu-item">dfgs</li>
                <li class="submenu-item">sdfsf</li>
            </ul>
        </li>
        <li class="menu-item">Banan</li>
        <li class="menu-item">Banan</li>
        <li class="menu-item">Banan</li>
    </ul>
    
</nav>

CSS

ul { list-style: none; }
.menu-item {
    padding: 0 15px;
    position: relative;
    float: left;
}

.menu-item:hover .submenu {
    display: block;
}

.submenu {
    background: grey;
    display: none;
    position: absolute;
    left: 0;
}