JSFiddle - React, Tailwind, and code Playground

by web tiki

HTML

<div id="container">
    <div class="item" ></div>
    <div class="item" ></div>
    <div class="item" ></div>
    <div class="item" ></div>
    <div class="item" ></div>
    <div class="item" ></div>
    <div class="item" ></div>
    <div class="item" ></div>
    <div class="item" ></div>
    <div class="item" ></div>
    <div class="item" ></div>
    <div class="item" ></div>
    <div class="item" ></div>
    <div class="item" ></div>
    <div class="item" ></div>
    <div class="item" ></div>
    <div class="item" ></div>
    <div class="item" ></div>
    <div class="hidden"></div>
    <div class="hidden"></div>
    <div class="hidden"></div>
    <div class="hidden"></div>
    <div class="hidden"></div>
    <div class="hidden"></div>
    <div class="hidden"></div>
</div>

CSS

.item {
    margin: 0 5px 0 30px; 
    width: 160px; 
    height: 240px; 
    display: inline-block !important;
    background: #346234;
}

#container {
    text-align: justify !important; 
    -ms-text-justify: distribute-all-lines;
    text-justify: distribute-all-lines;
    margin: 50px;
}
.hidden{
    height:0; width: 160px;
    display:inline-block;
    margin: 0 5px 0 30px;
}