JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
  <li>A</li>
  <li>B</li>
  <li>C</li>
  <li>D</li>
  <li>E</li>
  <li>F</li>
  <li>G</li>
</ul>

SCSS

ul {
  display:flex;
  width:500px;
  align-items:flex-start;
  flex-wrap:wrap;
  li {
   width:50%;
  }
}