JSFiddle - React, Tailwind, and code Playground
HTML
<div class="grid-3x4">
<div>Aasdfasasdfsadfsadfsadf asdfasddfsadf sadfsadfasdfasdf sadfsadfasdfasdf sadfsadfasdfasdf sadfsadfasdfasdf</div>
<div>B</div>
<div>C</div>
<div>A</div>
<div>B</div>
<div>C</div>
<div>A</div>
<div>B</div>
<div>C</div>
</div>
CSS
.grid-3x4 {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-template-rows: 1fr 1fr 1fr 1fr;
grid-template-areas:
'a b c '
'd e f'
'g h i'
'l m n';
}
.grid-3x4 > div {
min-height: 10vh;
max-height: 10vh;
overflow: hidden;
}