JSFiddle - React, Tailwind, and code Playground

HTML

<div class="randomDiv">
    <div class="centerImgWrapper">
        <img src="http://upload.wikimedia.org/wikipedia/commons/thumb/8/85/Smiley.svg/800px-Smiley.svg.png"></img>
    </div>
</div>

CSS

.randomDiv {
    position: relative;
    width: 100px;
    height: 140px;
    background-color: black;
}
.centerImgWrapper {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}
.centerImgWrapper img {
    left: 0;
    right:0;
    top: 0;
    bottom:0;
    max-height: 100%;
    max-width: 100%;
    margin:auto;
    position:absolute;
}