JSFiddle - React, Tailwind, and code Playground
HTML
<div class="container">
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
</div>
CSS
.container {
display: flex;
flex-wrap: wrap;
margin: 0 -7.5px; /* так как у блоков появляются отступы слева и справа нам их нужно убрать */
}
.block {
width: calc(100% / 3 - 33.125px);
/* 33.125 этим значением мы убираем отступы top, right, left, bottom и так как у нас 100% / 3 дает 33% мы убираем ещё 3.125px*/
margin: 7.5px;
background-color: yellow;
height: 250px;
}