JSFiddle - React, Tailwind, and code Playground

HTML

<div class="flex">
            <div class="block">1</div>
            <div class="block">2</div>
            <div class="block">3</div>
            <div class="block">4</div>
            <div class="block">5</div>
            <div class="block">6</div>
            <div class="block">7</div>
            <div class="block">8</div>
        </div>

CSS

.flex{
     width: 290px;
     background: #ffcc00;
     height: 260px;

     display: flex;
     flex-direction: column;
     flex-wrap: wrap;                
   }
  .block{ 
      width: 50px;
      height: 100px;
      background: #eee;
      margin: 10px;
    }