JSFiddle - React, Tailwind, and code Playground
HTML
<div class="flex">
<div class="child">
<img src="https://www.google.fr/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png" />
<p> Text </p>
<p> Text </p>
</div>
<div class="child">
<img src="https://www.google.fr/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png" class="small" />
<p> Text </p>
</div>
<div class="child">
<img src="https://www.google.fr/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png" />
<p> Text </p>
<p> Text </p>
</div>
</div>
CSS
.flex {
display: flex;
justify-content: space-around;
height: 200px; /* for demo */
border: 1px dashed red;
}
.child {
display: flex;
flex-direction: column;
text-align: center;
border: 1px dashed red;
}
img {
margin: auto 0;
max-width: 100px;
}
.small {
max-width: 50px;
}
p {
margin: 0;
}