JSFiddle - React, Tailwind, and code Playground

HTML

<div>
  <dl>
    <dt>Text</dt>
    <dd>1</dd>
  </dl>
  <dl>
    <dt>Text</dt>
    <dd>1</dd>
  </dl>
  <dl>
    <dt>Text</dt>
    <dd>1</dd>
  </dl>
  <dl>
    <dt>Text</dt>
    <dd>1</dd>
  </dl>
  <dl>
    <dt>Text</dt>
    <dd>1</dd>
  </dl>
</div>

CSS

div {
  display: flex;
  align-content: center;
  justify-content: flex-start;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
}

dl {
  background-color: dodgerblue;
  padding: 2rem 0;
  text-align: center;
  box-sizing: border-box;

  flex: 1 0 200px
}

dl:not(:last-child) {
  border-right: 1px solid white;
}

dt {
  display: block;
}

dd {
  display: block;
  margin-left: 0;
}