JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="displ-inl">
    <li>One</li>
    <li>Two</li>
    <li>Three</li>
</ul>

<ul class="displ-ib">
    <li>One</li>
    <li>Two</li>
    <li>Three</li>
</ul>

<ul class="displ-inl">
    <li>One</li>
    <li>Two<br>lines</li>
    <li>Three</li>
</ul>

<ul class="displ-ib">
    <li>One</li>
    <li>Two<br>lines</li>
    <li>Three</li>
</ul>

CSS

ul {
    margin: 2em;
}

li {
    background: #00cc88;
    color: #ffffff;
    padding: 1em;
}

.displ-inl li {
    display: inline;
}

.displ-ib li {
    display: inline-block;
}