JSFiddle - React, Tailwind, and code Playground

HTML

<div class="product">
      <div class="image">
        <a href="#">
            <img src="http://i.imgur.com/rthFtAb.jpg" />
        </a>
      </div>
    </div>

CSS

.product {
        height:225px;
        min-height:225px;
        max-width:220px;
        background-color:#ff00ff;
    
    }
    
    .image {
        min-height:225px;
        display:table-cell;
        vertical-align:middle;
    }
    
    .image img {
        max-width:100%;
    }