JSFiddle - React, Tailwind, and code Playground

by Yuriy

HTML

<div class="center-cropped" 
     style="background-image: url('http://viks.me/upload/iblock/877/87796af1f09cc7dac442cde0daae6c5c.jpg');">
         <img src="http://viks.me/upload/iblock/877/87796af1f09cc7dac442cde0daae6c5c.jpg" />
</div>

CSS

.center-cropped {
    width: 200px;
    height: 200px;
    background-position: center center;
    background-repeat: no-repeat;
    overflow: hidden;
}

.center-cropped img {
    min-height: 100%;
    min-width: 100%;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
}