JSFiddle - React, Tailwind, and code Playground

HTML

<nav>
    <ul class="clear">
        <li><a href="#">Hello</a></li>
        <li><a href="#">World</a></li>
        <li><a href="#">Third</a></li>
        <li><a href="#">Fourth</a></li>
    </ul>
</nav>

CSS

nav {
    background: #f00;
}

nav ul li {
    float: left;
    padding: 5px;
    margin-right: 20px;
}

.clear:after {
    clear: both;
    content: "";
    display: table;
}