JSFiddle - React, Tailwind, and code Playground

by web tiki

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<div id="row">
    <div class="col-sm-6">
        <h1>Meest bekeken</h1>
        <div id="row">
            <div class="col-sm-6"> 
                <a href="#" class="thumbnail">
                    <div class="caption">
                        title<br/>3 x bekeken
                     </div>
                    <div class="image">
                     <img src="http://graphicrecording.net/wp-content/uploads/2014/03/newest-about-plain-black-t-shirt-back10.jpg" class="img img-responsive full-width" />
                    </div>
                 </a>
            </div>
            <div class="col-sm-6"> 
                <a href="#" class="thumbnail">
                    <div class="caption">
                        title<br/>
                        3 x bekeken
                     </div>
                    <div class="image">
                     <img src="http://eaglecrews.com/wp-content/uploads/2014/03/T-shirt-Vector.jpg" class="img img-responsive full-width" />
                    </div>
                 </a>
            </div>
            <div class="col-sm-6"> 
                <a href="#" class="thumbnail">
                    <div class="caption">
                        title<br/>
                        3 x bekeken
                     </div>
                    <div class="image">
                     <img src="http://img2.wikia.nocookie.net/__cb20120206184108/jet/images/1/16/Blank_T-shirt.gif" class="img img-responsive full-width" />
                    </div>
                 </a>
            </div>
        </div>
    </div>
    <div class="col-sm-6">
         <h1>Other div</h1>
    </div>
</div>

CSS

.image{
    position:relative;
    overflow:hidden;
    padding-bottom:100%;
}
.image img{
    position:absolute;
}