JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    <div class="inline-block"><div class="one box">1</div>
    </div>
    <div class="inline-block"><div class="one box">2</div>
    </div>
    <div class="inline-block"><div class="one box">3</div>
    </div>
    <div class="inline-block"><div class="one box">4</div>
    </div>
    <div class="inline-block"><div class="one box">5</div>
    </div>
     <div class="inline-block"><div class="one box">6</div>
    </div>
     <div class="inline-block"><div class="one box">7</div>
    </div>
      <div class="inline-block"><div class="one box">8</div>
    </div>

CSS

body {
  max-width: 1150px;
  min-width: 900px;
  margin:0 auto; }

.container {
  text-align:center;
  background-color:#e1e1e1; }

.box {
  width: 250px; }

.inline-block {
  color: #eee;
  margin: 10px 0px 0px 10px;
  text-align: center;
  display:inline-block;
  float: left;
}

.one {
  height: 22px;
  background: #744; }