JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="building_images">
    <li>
        <img class="img1" src="http://www.keenthemes.com/preview/metronic/theme/assets/global/plugins/jcrop/demos/demo_files/image1.jpg" />
    </li>
    <li>
        <img class="img2" src="http://www.keenthemes.com/preview/metronic/theme/asshttp://assets.inhabitat.com/wp-content/blogs.dir/1/files/2013/08/leaf-veins-537x357.jpg"
        <li>
        <img class="img3" src="https://upload.wikimedia.org/wikipedia/commons/6/6f/Autumn_Leaves_(coloured).JPG" />
    </li>
    <li>
        <img class="img4" src="http://progrounds.com/wp-content/uploads/2014/11/Mowing-leaves.jpg" />
    </li>
    <li>
        <img class="img5" src="http://www.keenthemes.com/preview/metronic/theme/assets/global/plugins/jcrop/demos/demo_files/image1.jpg" />
    </li>
</ul>

CSS

ul {
    margin: 0; 
    padding: 0;
}
.building_images li {
    width: 80px;     /* Set your width */
    height: 150px;   /* Set your height */
    margin: 0 30px 30px 0; /* Set your margins (top right bottom left) */
    list-style: none; 
    float: left;
    position: relative; 
    background: red; /* Just for the demo, to see the <li> */
}

	.building_images li img {
	    max-width: 100% !important; /* Auto scale your images to full width */
	    position: absolute; 
	    top: auto;
        left: 0;
        right: 0;
	    bottom: 0; /* Align your images at the bottom */
	}