JSFiddle - React, Tailwind, and code Playground

HTML

<div id="herp">
    <div class="derp">
        <p><img src="http://pressupinc.com/wp-content/uploads/2013/09/100_0394.jpg" /></p>
        <p><img src="http://pressupinc.com/wp-content/uploads/2013/09/100_0399.jpg" /></p>
        <p><img src="http://pressupinc.com/wp-content/uploads/2013/09/100_0401.jpg" /></p>
    </div>
    <div class="derp">
        <p><img src="http://pressupinc.com/wp-content/uploads/2013/09/100_0406.jpg" /></p>
        <p><img src="http://pressupinc.com/wp-content/uploads/2013/09/100_0397.jpg" /></p>
        <p><img src="http://pressupinc.com/wp-content/uploads/2013/09/100_0398.jpg" /></p>
    </div>
</div>

CSS

.derp p {
    float: left;
    width: 30%;
    height: 0;
    padding-bottom: 30%;
    margin: 1%;
    overflow: hidden;
}

.derp img {
    min-width: 100%;
    height: 100%;
}