JSFiddle - React, Tailwind, and code Playground

by qwweee7467

HTML

<div class="BOX"> <a href="http://www.google.com/"><img src="https://www.google.com.tw/logos/doodles/2014/world-cup-2014-10-4857073841995776-hp.gif" alt="test" width="300" height="300" /></a>
</div>

CSS

body {
	background-color: #EEE;
}

.BOX {
	width: 300px;
	height: 300px;
	border: 5px solid #444;
	box-shadow: 1px 5px 5px #666;
	
	position:absolute;
	left:50%;
	top:50%;
	
	margin-top:-150px;
	margin-left:-150px;
}

JavaScript

/* Centering a Div Vertically with CSS - Samples */
/* Other sample : Cross-browser Vertical & Horizontal Centering - http://emergentweb.com/test/valign.html */