JSFiddle - React, Tailwind, and code Playground

HTML

<div class="flexbox">
  <div class="content1"> C1 </div>

  <div class="content2"> C2 </div>

  <div class="content3"> C3 </div>

  <div class="conten4"> C4 </div>
</div>

CSS

.flexbox {
  display: flex;
  border: 1px solid black;
  width: 330px;
}

.content1 {
  width: 100px;
  margin-right: 10px;
  background-color: blue;
  height: 50px;
}

.content2 {
  width: 100px;
  margin-right: 10px;
  background-color: yellow;
}

.content3 {
  width: 100px;
  margin-right: 10px;
  background-color: red;
}

.content4 {
  width: 100px;
  background-color: green;
  height: 10px;
}