JSFiddle - React, Tailwind, and code Playground

by Oski Krawczyk

HTML

<div>
    <ul>
<li class="li1">adfasf</li>
<li class="li2">asfadsfsaf asdfasfasdf safsa asf sadf </li>
<li class="li3">adfasdf saf sadf asdf sadf asf</li>
<li class="li4">safds as</li>
<li class="li5"> asdf asdf asf asd fasfd</li>
<li class="li6">asdf</li>
<li class="li7"> asfa sdfsadf saf asdf asdf asdasdg </li>
<li class="li8">sadfasdf asdf asd fsdafasdf asdf asdf asdf sadf asdfsa fasd gf</li>
<li class="li9">asdfasdf</li>
</ul>
</div>

CSS

div {
    
    width: 214px;
    border: solid 1px blue;
}

ul {
    overflow: hidden;
    height: 100%;
    border: solid 1px green;
    width: 230px;
}

li {
    width: 100px;
    height: 100px;
    margin: 0 10px 0 0;
    border: solid 1px red;
    float: left;
}