JSFiddle - React, Tailwind, and code Playground

HTML

<div class="vertical-scroll">
  <div class="left-floater">
    One
  </div>
  <div class="left-floater">
    Two
  </div>
  <div class="left-floater">
    Three
  </div>
  <div class="left-floater">
    I should be to the left of "Three"
  </div>
  <div class="left-floater">
    I float.
  </div>
  <div class="left-floater">
    I float.
  </div>
  <div class="left-floater">
    I float.
  </div>
  <div class="left-floater">
    I float.
  </div>
</div>

CSS

.vertical-scroll {
  width:400px;
  border:1px solid;
  overflow-x:scroll;
  overflow-y:auto;    
}
.left-floater {
  width:100px;
  height:100px;
  border:1px solid;    
  float:left;
}