JSFiddle - React, Tailwind, and code Playground
HTML
<div class="row">
<div class="col-sm-4 col-md-3 col-lg-2 thumbnailcontainer">
<div class="thumbnail">
<img src="http://animalia-life.com/data_images/mammal/mammal4.jpg" alt="image">
<div class="caption">
<div class="thumbnailheader"><h3>Lorem ipsum</h3></div>
<p>Lorem ipsum ad his scripta blandit partiendo.</p>
<p><a href="#" class="btn btn-default center-block" role="button">Open</a></p>
</div>
</div>
</div>
<div class="col-sm-4 col-md-3 col-lg-2 thumbnailcontainer">
<div class="thumbnail">
<div class="img-container">
<img src="http://upload.wikimedia.org/wikipedia/commons/0/03/Mountain_Bluebird.jpg" alt="image">
</div>
<div class="caption">
<div class="thumbnailheader"><h3>Lorem ipsum.</h3></div>
<p>Lorem ipsum ad his scripta blandit partiendo.</p>
<p><a href="#" class="btn btn-default center-block" role="button">Open</a></p>
</div>
</div>
</div>
<div class="col-sm-4 col-md-3 col-lg-2 thumbnailcontainer">
<div class="thumbnail">
<img src="http://upload.wikimedia.org/wikipedia/commons/8/84/Leaning_Tower_of_Pisa_(April_2012).jpg" alt="image">
<div class="caption">
<div class="thumbnailheader"><h3>Lorem ipsum.</h3></div>
<p>Lorem ipsum ad his scripta blandit partiendo.</p>
<p><a href="#" class="btn btn-default center-block" role="button">Open</a></p>
</div>
</div>
</div>
</div>
CSS
@import url('http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css');
@import url('http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css');
.thumbnailcontainer
{
height: 40rem;
width: 20rem;
}
.img-container
{
}
img
{
max-height: 100%;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}