JSFiddle - React, Tailwind, and code Playground
HTML
<div class="container">
<div class="column" id="a"><div>Contents A</div></div>
<div class="column" id="b"><div>Contents B</div></div>
<div class="column" id="c"><div>Contents C</div></div>
</div>
CSS
.container {
text-align: center;
margin: 0 auto;
}
.column {
display: inline-block;
width: 150px;
height: 150px;
}
.column > div {
position: relative;
top: 50%;
transform: translateY(-50%);
}
#a { background-color: pink; }
#b { background-color: lightgreen; }
#c { background-color: lightblue; }