JSFiddle - React, Tailwind, and code Playground

by Uday Hiwarale

HTML

<div>
  <img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=600%C3%97150&w=600&h=150"/>
</div>

CSS

div {
  width:300px;
  height:300px;
  border:2px solid #aaa;
  
	position:relative;
}
div > img {
  max-width:100%;
	max-height:100%;
  
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	margin:auto;
}