JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li class="one">One</li>
    <li class="one">Two</li>
    <li class="one">Three</li>
    <li class="two">Four</li>
    <li class="two">Five</li>
    <li class="two">Six</li>
    <li class="one">One</li>
    <li class="one">Two</li>
    <li class="one">Three</li>
    <li class="two">Four</li>
    <li class="two">Five</li>
    <li class="two">Six</li>
    <li class="one">One</li>
    <li class="one">Two</li>
    <li class="one">Three</li>
    <li class="two">Four</li>
    <li class="two">Five</li>
    <li class="two">Six</li>
</ul>

CSS

.one {
  display: inline;
}

.two {
  display: inline; height:300px;
}

ul {
    max-width: 100%;
}

ul li {
    padding: 10px;
}