JSFiddle - React, Tailwind, and code Playground
HTML
<ul class="inline-list">
<li><a>Everything</a></li>
<li><a>Is</a></li>
<li><a>Fine</a></li>
<li><a>With</a></li>
<li><a>Multiline</a></li>
<li><a>HTML</a></li>
</ul>
</br></br>
<div>With letter spacing</div>
<ul class="inline-list ls">
<li><a>Everything</a></li>
<li><a>Is</a></li>
<li><a>Fine</a></li>
<li><a>With</a></li>
<li><a>Multiline</a></li>
<li><a>HTML</a></li>
</ul>
</br>
</br>
<div>With word spacing<div>
<ul class="inline-list ws">
<li><a>Everything</a></li>
<li><a>Is</a></li>
<li><a>Fine</a></li>
<li><a>With</a></li>
<li><a>Multiline</a></li>
<li><a>HTML</a></li>
</ul>
<p>HTML in single line:</p>
<ul class="inline-list"><li><a>This</a></li><li><a>Is</a></li><li><a>A</a></li><li><a>Weird</a></li><li><a>CSS/HTML</a></li><li><a>Bug</a></li></ul>
CSS
.inline-list {
text-align: justify;
list-style: none;
margin: 0;
padding: 0;
}
.ls {
letter-spacing:40px;
}
.ws {
word-spacing:20px;
}
.inline-list li {
letter-spacing:initial;
display: inline-block;
margin: 0;
padding: 0;
}
.inline-list li a {
display: block;
padding: 5px 10px;
}