JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li>
        asdasdasd <br>
        asdasdasd <br>
        asdasdasd <br>
        asdasdasd <br>
        asdasdasd <br>
        asdasdasd <br>
        asdasdasd <br>
        asdasdasd <br>
        asdasdasd <br>
    </li>
      <li>
        bcvbcvbcv
    </li>
      <li>
        asdasdasd
    </li>
      <li>
        asdasdasd
    </li>
    
</ul>

CSS

li {
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 10px;
    background-color: #f1f1f1;
    height: auto;
    overflow: hidden;
}

li:hover {
    cursor: pointer;
    height: auto;
}