JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="first">
    <li>Puntk1
        <div id="second1">
            <ul>
<li>Puntk1.1</li>
<li>Puntk1.2</li>
<li>Puntk1.3</li>
<li>Puntk1.4</li>
<li>Puntk1.5</li>            
        </ul>
    </div>
    </li>
</ul>

CSS

.first li {
    float: left;
        list-style: none;
        margin-right: 11px;
    position; relative;
}
#second1 {
    background: #125622;
    position: absolute;
    padding: 10px 15px;
    top: 20px;
    left: 0;
}
#second1 ul {
    position: rilative;
}
#second1 ul li {
    float: none;
}