JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
  <div class="first"></div>
  <div class="second"></div>
  <div class="third"></div>
  <div class="fourth"></div>
  <!-- <br style="clear: both;"> -->
</div>

CSS

#container {
  overflow: hidden;
  background: silver;
  width: 500px;
  height: 500px;
  white-space: nowrap;
  overflow: auto;
}

#container>div {
  border: 1px solid #000;
  width: 30%;
  height: 100px;
  margin: 10px;
  /* float: left; */
  display: inline-block;
}