JSFiddle - React, Tailwind, and code Playground

HTML

<div class="floating-box1">Floating box1</div>
<div class="nofloat">Floating box</div>
<div class="floating-box">Floating box2</div>
<div class="nofloat">Floating box</div>
<div class="floating-box">Floating box3</div>
<div class="nofloat">Floating box</div>
<div class="floating-box">Floating box4</div>

CSS

.floating-box1 {
    float: left;
    width: 150px;
    height: 75px;
    margin: 10px;
    background: #fc0;
  border: 1px solid #f90;
  border-radius: 5px;
  padding: 10px;
}
.floating-box {
    background: #fc0;
  border: 1px solid #f90;
  border-radius: 5px;
  padding: 10px;
    float: left;
    width: 150px;
    height: 75px;
    margin: 10px;
    margin-left:-160px; 
}
.nofloat{
visibility:hidden;
}