JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrap">
    <img src="http://placehold.it/150x150" />
</div>

CSS

.wrap {
  overflow: hidden;
    border: 1px solid red;
    display: block;
  max-width: 500px;
  height: 500px;
    text-align: center;
}

img {
    display: inline;
 position: relative;
  top: 50%;
  	-webkit-transform: translateY(-50%);
  	-ms-transform: translateY(-50%);
  	transform: translateY(-50%);
}