JSFiddle - React, Tailwind, and code Playground

by justjohn

HTML

<div class="test">
<ul>
    <li>Item A</li>
    <li>Item B</li>
    <li>Item C</li>
    <li>Item D</li>
    <li>Item E</li>
    <li>Item F</li>
    <li>Item G</li>
    <li>Item A</li>
    <li>Item B</li>
    <li>Item C</li>
    <li>Item D</li>
    <li>Item E</li>
    <li>Item F</li>
    <li>Item G</li>
    <li>Item A</li>
    <li>Item B</li>
    <li>Item C</li>
    <li>Item D</li>
    <li>Item E</li>
    <li>Item F</li>
    <li>Item G</li>
</ul>
</div>

CSS

.test {
    height: 2em;
    margin: 20px;
    background: red;
    overflow:auto;
    font-size: 1.4em;
}
.test ul {
    width: 3000px;
}
.test li {
    display: block;
    float:left;
}