JSFiddle - React, Tailwind, and code Playground

by infiniteloops

HTML

<div class='inline'>
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
<li>Item 5</li>
<li>Item 6</li>
    </ul>
Test
</div>
<div class='floated'>
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
<li>Item 5</li>
<li>Item 6</li>
    </ul>
Test
</div>

CSS

.floated UL {
    width: 100px;
    list-style-type: none;
    margin: 0px;
    padding: 0px;
    background-color: blue;
display: inline-block;
}
.floated LI {
    margin: 0px;
    width: 50px;
    float: left;}

.inline UL {
    width: 100px;
    list-style-type: none;
    margin: 0px;
    padding: 0px;
    background-color: red;
}
.inline LI {
    margin: 0px;
    width: 50px;
    display: inline;}