JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="ul-one">
    <li><a href="">test</a></li>
    <li><a href="">testtest</a></li>
    <li><a href="">test</a></li>
    <li><a href="">test</a></li>
    <li><a href="">test</a></li>
</ul>
<ul class="ul-two">
    <li><a href="">test</a></li>
    <li><a href="">test</a></li>
    <li><a href="">test</a></li>
    <li><a href="">test</a></li>
    <li><a href="">test</a></li>
</ul>
<ul class="ul-three">
    <li><a href="">test</a></li>
    <li><a href="">test</a></li>
    <li><a href="">test</a></li>
    <li><a href="">test</a></li>
    <li><a href="">test</a></li>
</ul>
<ul class="ul-four">
    <li><a href="">test</a></li>
    <li><a href="">test</a></li>
    <li><a href="">test</a></li>
    <li><a href="">test</a></li>
    <li><a href="">test</a></li>
</ul>

CSS

ul {
    float:left;
    clear:right;
    padding:5px;
}
li {
    float:left;
    clear:left;
}
.ul-one {
    background-color:red;
}
.ul-two {
    background-color:blue;
}
.ul-three {
    background-color:black;
    color:white;
}
.ul-four {
    background-color:green;
}