JSFiddle - React, Tailwind, and code Playground

HTML

<div style="height:200px; width:300px; background: red; overflow: hidden;" >
	<div style="width:50px; height:50px; background:black" class="center" >
	
	</div>
</div>

JavaScript

$(document).ready(function(){
  $(".center").each(function(){
   var height = parseInt($(this).parent().css("height"));
   var width = parseInt($(this).parent().css("width"));
   $(this).parent().css("overflow", "hidden");
   $(this).css({
     "margin-top" : ( height - parseInt($(this).css("height"))) / 2,
     "margin-left" : ( width - parseInt($(this).css("width"))) / 2
   });
  });
});