JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li>
        <a href="#">Пункт 3, немного</a>
        <ul>
            <li><a href="#">Подпункт 1, тут побольше</a></li>
            <li><a href="#">Подпункт 2</a></li>
            <li><a href="#">Подпункт 3</a></li>
            <li><a href="#">Подпункт 4</a></li>
            <li><a href="#">Подпункт 5</a></li>
        </ul>
    </li>
</ul>

CSS

ul li{
    position:relative;
    float:left; /*либо фиксированая ширина*/
}
ul li ul{
    display:none;
    position:absolute; z-index: 2;
    top:100%; left:0; right:0; 
}
ul li:hover ul{display:block;}
ul li ul li{float:none;}