JSFiddle - React, Tailwind, and code Playground

by Shidhin C R

HTML

<div class="wrapper">
  <img src="http://placekitten.com.s3.amazonaws.com/homepage-samples/200/286.jpg" alt="" class="photo-view">
</div>

CSS

.wrapper {
  border: 2px solid red;
  position: relative;
  /* overflow: hidden; */
  width: 175px;
  height: 250px;
  margin: 200px;
}

.photo-view {
  /* position: absolute; */
  top: 0; left: 0; right: 0; bottom: 0;
  margin: auto;
  max-width: 100%;
  max-height: 100%;
  transform: scale(2);
  z-index: -1;
}