JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li>01</li>
    <li>02</li>
    <li>03</li>
    <li>04</li>
    <li>05</li>
    <li>06</li>
    <li>07</li>
</ul>

CSS

ul {
    /* reset */
    margin:0;
    padding:0;
    
    /* estilo */
    list-style:none;
    display:table;
    width:100%;
}

ul li {
    box-sizing: border-box;
    border:1px dashed #f0f;
    padding:5px 0;
    text-align:center;
    
    /* 
        Se for utilizar responsive, utilize este código com o código do media.
        Se não for utilizar, basta apagar os códigos daqui para baixo
    */
    width:25%; /* ou configure outro valor */
    display:inline-block;
}

@media(min-width:768px) {
    ul li {
        width:auto;
        display:table-cell;
    }
}