JSFiddle - React, Tailwind, and code Playground

by Nivedita Gautam

HTML

<ul>
    <li class="test">Hello</li>
    <li class="test">Welcome</li>
    <li class="test">Test Process</li>
    <li class="test">Text Message</li>
</ul>

CSS

ul {
    width: 100%;
}
.test {
    height:20px;
    min-width:20%;
    border: 1px solid black;
    border-radius: 3px;
    display: inline-block;
    float: left;
    margin-left: 5px;
    text-align: center;
    overflow:hidden;
    min-width:100px;
}