JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
   <li>flexible number</li>
   <li>and length of</li>
   <li>list items:</li>
    <li>Add more!</li>
    <li>X</li>
    <li>Y</li>
</ul>

CSS

ul {
    height: 1em;
    text-align: justify;
    overflow: hidden;
    padding-left: 0;
    width:100%;
    border: 1px solid black;
    display:table;
}
li {display: table-cell;}