JSFiddle - React, Tailwind, and code Playground

HTML

<div class="className">
    <img src="http://www.ownzee.com/attachments/2011/12/pic2/4ee51196-c98c-401f-a67e-0e3dcdbab12d.jpg" alt="example" height="1000" width="1000">
</div>

CSS

.className {
  height: 460px;
  position: relative;
  overflow: hidden;
  width: 320px;
  border: 1px solid black; //Ignore this, it is only to show where the container ends
}
.className img {
  left: 50%;
  margin: -500px 0 0 -500px;
  position: absolute;
  top: 50%;
}