JSFiddle - React, Tailwind, and code Playground

HTML

<div class="flex-container">
  <div class="box"></div>
  <div class="box"></div>
  <div class="box"></div>
  <div class="box"></div>
</div>

CSS

.flex-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  height: 150px;
  width: 400px;
  border: 2px solid red;
  overflow-x: auto;
}

.box {
  height: 100px;
  width: 100px;
  border: 2px solid black;
  margin: 10px;
  flex: none;
}