JSFiddle - React, Tailwind, and code Playground
HTML
<section>
<div class="box">13534534534534</div>
<div class="box">233454354</div>
<div class="box">34345345345</div>
<div class="box">4345345</div>
</section>
CSS
section {
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row;
flex-direction: row;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
width: 100%;
box-sizing:border-box;
margin:0;
}
.box {
border: 1px solid black;
background: #ccc;
display: block;
/*
50% - (border-left-width + border-right-width +
padding-left + padding-right)
*/
-webkit-flex-basis: calc(50% - 2px);
flex-basis: calc(50% - 2px);
margin:0;
}