JSFiddle - React, Tailwind, and code Playground

HTML

<article class="box">
    <header class="entry-header">Short Post</header>
    <footer class="entry-meta">24 December 2013</footer>
</article>
<article class="box">
    <header class="entry-header">Class aptent taciti sociosqu</header>
    <footer class="entry-meta">24 December 2013</footer>
</article>
<article class="box">
    <header class="entry-header">Vestibulum gravida elementum justo</header>
    <footer class="entry-meta">24 December 2013</footer>
</article>

CSS

.box {
    background-color: #333333;
    color: white;
    width: 144px;
    height: 144px;
    display: inline-flex;
    flex-direction: column;
}
.box header {
    text-align: center;
    word-wrap: break-word;
    margin: 0 10px 0 10px;
    padding-top: 15px;
}
.box footer {
    text-align: center;
    margin-top: auto;
    font-size: 12px;
    padding-bottom: 15px;
}