JSFiddle - React, Tailwind, and code Playground

HTML

<div class="flex-container">
  <div class="flex-item-blue">
    <div class="item-name">
    Strawberry
    </div>
    <div class="item-amt">
    1
    </div>
  </div>
  <div class="flex-item-grey">
    <div class="item-name">
    Strawberry
    </div>
    <div class="item-amt">
    1
    </div>
  </div>
  <div class="flex-item-blue">
    <div class="item-name">
    Strawberry
    </div>
    <div class="item-amt">
    1
    </div>
  </div>
  <div class="flex-item-grey">
    <div class="item-name">
    Strawberry
    </div>
    <div class="item-amt">
    1
    </div>
  </div>
  <div class="flex-item-blue">
    <div class="item-name">
    Strawberry
    </div>
    <div class="item-amt">
    1
    </div>
  </div>
  <div class="flex-item-grey">
    <div class="item-name">
    Strawberry
    </div>
    <div class="item-amt">
    1
    </div>
  </div>
  <div class="flex-item-blue">
    <div class="item-name">
    Strawberry
    </div>
    <div class="item-amt">
    1
    </div>
  </div>
  <div class="flex-item-grey">
    <div class="item-name">
    Strawberry
    </div>
    <div class="item-amt">
    1
    </div>
  </div>
  <div class="flex-item-blue">
    <div class="item-name">
    Strawberry
    </div>
    <div class="item-amt">
    1
    </div>
  </div>
  <div class="flex-item-grey">
    <div class="item-name">
    Strawberry
    </div>
    <div class="item-amt">
    1
    </div>
  </div>
  <div class="flex-item-blue">
    <div class="item-name">
    Strawberry
    </div>
    <div class="item-amt">
    1
    </div>
  </div>
  <div class="flex-item-grey">
    <div class="item-name">
    Strawberry
    </div>
    <div class="item-amt">
    1
    </div>
  </div>
  <div class="flex-item-blue">
    <div class="item-name">
    Strawberry
    </div>
    <div class="item-amt">
    1
    </div>
  </div>
  <div class="flex-item-grey">
    <div class="item-name">
    Strawberry
    </div>
    <div class="item-amt">
    1
    </div>
  </div>
  <div class="flex-item-blue">
   ...

CSS

.flex-container {
  display: grid;
  text-align: center;
  grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
  width:85%;
}

.flex-item-blue {
  background-color: light-blue;
  width:100%;
  /*border:1px solid orange;*/
}

.flex-item-grey {
  background-color: grey;
  border-left:1px solid black;
}
.item-name{
  text-align:left;
  display:inline-block;
  /*border:1px solid green;*/
  width:70%;
}

.item-amt{
  text-align:center;
  display:inline-block;
  width:20%;
  /*border:1px solid red;*/
}