JSFiddle - React, Tailwind, and code Playground
HTML
<html>
<body>
<ol style="border:1px solid red;font-size:100px;">
<li style="white-space:nowrap;overflow:hidden;text-overflow:ellipsis;">Long list item. Ellipsis works.</li>
</ol>
<ol style="float:left;border:1px solid red;font-size:100px;">
<li style="white-space:nowrap;overflow:hidden;text-overflow:ellipsis;">Float left list. No ellipsis here.</li>
</ol>
</body>
</html>