JSFiddle - React, Tailwind, and code Playground
HTML
<div id="container">
<div id="div1">
<span>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit
</p>
</span>
</div>
<div id="div1">
<span class="">
<p class="">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, Lorem ipsum dolor sit amet.
</p>
</span>
</div>
<div id="div1">
<span>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit
</p>
</span>
</div>
<div id="div4">
<span class="">
<p class="">
Lorem ipsum dolor sit amet, consectetur adipisicing elit
</p>
</span>
</div>
<div id="div5">
<span class="">
<p>
Lorem ipsum dolor sit amet, Lorem ipsum dolor sit amet, Lorem ipsum dolor sit amet, Lorem ipsum dolor sit amet, consectetur adipisicing elit
</p>
</span>
</div>
<div id="div6">
<span class="">
<p>
Lorem ipsum dolor sit amet
</p>
</span>
</div>
<div id="div7">
<span class="">
<p>
Lorem ipsum dolor sit amet, Lorem ipsum dolor sit amet, Lorem ipsum dolor sit amet, consectetur adipisicing elit
</p>
</span>
</div>
<div id="div8">
<span class="">
<p class="">
Lorem ipsum dolor sit amet, consectetur adipisicing elit
</p>
</span>
</div>
<div id="div9">
<span class="">
<p>
Lorem ipsum dolor sit amet, Lorem ipsum dolor sit amet, consectetur adipisicing elit
</p>
</span>
</div>
</div>
CSS
#container {
width: 350px;
}
#container div {
background: #aaa;
width: 100px;
margin-top: 5px;
margin-left: 5px;
display: inline-block;
}
.h100 {
height: 100px;
}
#container p {
width: 100px;
min-height: 50px;
padding: 0; margin: 0;
background: #aaa;
padding: 2px;
font: 11px arial;
float: left;
}
span {
display: table-cell;
vertical-align: bottom;
}