JSFiddle - React, Tailwind, and code Playground

by IanY

HTML

<div>
    <img src="http://lorempixel.com/400/200/" alt="">
</div>
    
<div>
    <img src="http://lorempixel.com/200/400/" alt="">
</div>
        
<div>
    <img src="http://lorempixel.com/50/50/" alt="">
</div>

CSS

* {
    margin: 0;
    padding: 0;
    }

div {
	display: -ms-flexbox;
	display: -webkit-flex;
	display:         flex;
	    -ms-flex-direction: column;
	-webkit-flex-direction: column;
	        flex-direction: column;
	          -ms-flex-pack: center;
	-webkit-justify-content: center;
	        justify-content: center;
    margin: 20px auto;
    width: 300px;
    height: 300px;
    border: 2px solid #000;
    }

img {
    max-width: 100%;
    max-height: 100%;
    }