JSFiddle - React, Tailwind, and code Playground

HTML

<div id="box">
<div id="teaser">
<figure><img src="http://www.universetoday.com/wp-content/uploads/2008/09/sun_stereo_4dec2006_lrg.jpg"/>
</figure>
<div class="teaserText">
<h3>Hello world!</h3>
</div>
</div>
<div id="teaser">
<figure><img src="http://www.universetoday.com/wp-content/uploads/2008/09/sun_stereo_4dec2006_lrg.jpg"/>
</figure>
<div class="teaserText">
<h3>Hello world!</h3>
</div>
</div>
<div id="teaser">
<figure><img src="http://www.universetoday.com/wp-content/uploads/2008/09/sun_stereo_4dec2006_lrg.jpg"/>
</figure>
<div class="teaserText">
<h3>Hello world!</h3>
</div>
</div>
<div id="teaser">
<figure><img src="http://www.universetoday.com/wp-content/uploads/2008/09/sun_stereo_4dec2006_lrg.jpg"/>
</figure>
<div class="teaserText">
<h3>Hello world!</h3>
</div>
</div>
<div id="teaser">
<figure><img src="http://www.universetoday.com/wp-content/uploads/2008/09/sun_stereo_4dec2006_lrg.jpg"/>
</figure>
<div class="teaserText">
<h3>Hello world!</h3>
</div>
</div>
</div>

CSS

#thumbnail-container img {
    max-height: 100%;
    height:243px;
}

body {
    margin: 0    
}
#box {
  position: relative;
  width: 100%;
  height: 500px;
}
#teaser {
      color: #111;
    display: flex;
    flex-direction: column;
    position: relative;
    margin-bottom: 2em;
}