JSFiddle - React, Tailwind, and code Playground

by nilloc

HTML

<div id="row">
  <div class="item">1</div>
  <div class="item">2</div>
  <div class="right-column">
    <div class="item">3</div>
  </div>
</div>

CSS

#row{
  display:flex;
  justify-content:flex-start;
  flex-direction:row;
  background-color:rgba(0,0,0,0.6)
}
.item{
  flex:none;
  height:20px;
  width:40px;
  background-color:rgba(255,255,255,0.1);
}
.right-column{
  flex:1;
  display:flex;
  flex-direction:row;
  justify-content:flex-end;
}