JSFiddle - React, Tailwind, and code Playground

HTML

<h1>Header Title</h1>
<div class="outer">
  <div class="middle">
    <div class="inner" style="background: red">
    1
    </div>
    <div class="inner" style="background: green">
    2
    </div>
    <div class="inner" style="background: blue">
    3
    </div>
    <div class="inner" style="background: yellow">
    4
    </div>
    <div class="inner" style="background: orange">
    5
    </div>
  </div>
</div>

CSS

.outer {
  display: flex;
  overflow-x: scroll;
}

.middle {
  display: flex;
  width: 100%;
}

.inner {
  flex: 0 0 25%;
  height: 100px;
}