JSFiddle - React, Tailwind, and code Playground

by Oleh Kotsubko

HTML

<div class="table">
  <div class="table__item">
    <div class="item">1</div>
    <div class="item">2</div>
    <div class="item">3</div>
    <div class="item">4</div>
    <div class="item">5</div>
  </div>
  <div class="table__item">
    <div class="item">1</div>
    <div class="item">2</div>
    <div class="item">3</div>
    <div class="item">4</div>
    <div class="item">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cumque dolorem molestiae ut doloremque porro omnis quis ullam eveniet ratione mollitia similique excepturi facilis nisi tempora minima quasi quidem laboriosam, quos!</div>
  </div>
  <div class="table__item">
    <div class="item">1</div>
    <div class="item">2</div>
    <div class="item">3</div>
    <div class="item">4</div>
    <div class="item">5</div>
  </div>
  <div class="table__item">
    <div class="item">1</div>
    <div class="item">2</div>
    <div class="item">3</div>
    <div class="item">4</div>
    <div class="item">5</div>
  </div>
</div>

SCSS

* {
  box-sizing: border-box;
}
.table {
  display: grid;
  justify-content: center;
  align-items: center;
  
  &__item {
    display: grid;
    justify-content: center;
    align-items: center;
    grid-template-columns: 200px 1fr 1fr 1fr 1fr; 
    grid-column: 1;
    border: 1px solid #000;
    margin-bottom:  .5rem;
  }
}

.item {
  display: grid;
}