JSFiddle - React, Tailwind, and code Playground

HTML

<div class="theBox">
    <img src="http://w3dk.com/permalink/img/testpattern600x400.png" alt="">
</div>
    
    <p>Original Image:</p>
    <img src="http://w3dk.com/permalink/img/testpattern600x400.png" alt="" height="200">

CSS

.theBox {
   overflow: hidden;
   width: 240px;
   height: 200px;
}

.theBox img {
   display: block;
   height: 100%;
 }