JSFiddle - React, Tailwind, and code Playground

HTML

<div style="width: 100%;height: 250px;overflow-x: scroll;overflow-y: hidden;">
            <div style="width: 3000px;height: 250px;">
              <div style="width:300px;height:250px;float:left;background:red;">
              1
              </div>
              <div style="width:300px;height:250px;float:left;background:blue;">
              2
              </div>
              <div style="width:300px;height:250px;float:left;background:red;">
              3
              </div>
              <div style="width:300px;height:250px;float:left;background:blue;">
              4
              </div>
              <div style="width:300px;height:250px;float:left;background:red;">
              5
              </div>
              <div style="width:300px;height:250px;float:left;background:blue;">
              6
              </div>
            </div>
            </div>