JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
		<div class="inside"></div>
	</div>

CSS

.wrapper {
	width: 600px;
	height: 500px;
	margin: 40px auto 0;
	position: relative;
	border: 1px solid black;
	background: url(image_here.jpg) no-repeat center center;
}
.inside {
	top: 50%;
	left: 50%;
	width: 200px;
	height: 100px;
	margin-top: -50px; /* height/2 */
	margin-left: -100px; /* width/2 */
	position: absolute;
	background: #000;
}