JSFiddle - React, Tailwind, and code Playground

HTML

<div class="cnt">
  <div class="flex-item one">1</div>
  <div class="flex-item two">2</div>
  <div class="flex-item three">3</div>
  <div class="flex-item four">4</div>
  <div class="flex-item five">5</div>
  <div class="flex-item six">6</div>
</div>

CSS

* {margin:0; padding:0;}
.cnt {
  display:flex;
  margin:50px;
  background: #ffff00;
  justify-content: left;
  flex-wrap: wrap;
}
.cnt div {
  width: 100px;
  height: 100px;
  background: #999;
  margin: 10px;
}
.cnt::after {
  content: '';
  width: 100%;
}
.three,.four,.five,.six {
  order: 1;
}