JSFiddle - React, Tailwind, and code Playground

HTML

<div class="box">
  <div class="A">whatever</div>
  <div class="B">short</div>
  <div class="C"> a f*cking very very very very very long content</div>
</div>

CSS

.box{
  display:flex;
  flex-flox:row nowrap;
  justify-content:center;
  align-content:center;
  align-items:center;
  background-color:red;
}

.A{
  border:medium solid black;
}
.B{
  border:medium solid black;
}
.C{
  border:medium solid black;
}