JSFiddle - React, Tailwind, and code Playground

HTML

<div class="box">
    First element
  </div>
  
  <div class="cf">
  
  </div>

  <div class="box" >
    Second element
  </div>

  <div class="box">
    Third element
  </div>

CSS

.box {

      border: thick solid red;
      width: 400px;
      height: 400px;
      background-color: yellow;


    }
    
    
    .box:first-child {
      float: left;
    }
   
   .cf:before,
.cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.cf:after {
    clear: both;
}