JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrap">
    <div id="main">
        <img src="https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcRqHMio3jll2W62WXJHbufc-xxYPxec_ip8Ez0lQv2P7Umy2kPKrw">
    </div>
    <div>another div</div>
</div>

CSS

*{
	margin: 0;
	padding: 0;    
}

html,body{
	height: 100%;
	width: 100%;
}
.wrap{
	position: relative;
	z-index: auto;
	width: 100%;
	max-width: 960px;
	height: 100%;
	margin: 0 auto;
}
#main{
	width: 100%;
	border: 1px solid red;
    text-align: center;
}

img{
    max-width: 100%;
    margin: auto;
    vertical-align: middle;
}