JSFiddle - React, Tailwind, and code Playground

HTML

<div class="list">
  <div class="item"><span>text</span><span><span class="count">22</span></span></div>
  <div class="item"><span>text<br>text text</span><span><span class="count">22</span></span></div>
  <div class="item"><span>text text texttext text text texttext</span><span><span class="count">22</span></span>
</div>

CSS

.list{
  display:inline-block;
  padding:10px;
  background:#0f0;
  width:150px;
}
.item{
  display:table;
  padding:10px;
}
.item>span{
  display:table-cell;
  padding:0 5px;
  width:50%;
  vertical-align:middle;
}
.count{
  background:#f00;
  padding:2px;
  border-radius:50%;
}