A small CSS snippet for all your demo needs.

center.css

/**
*
* CSS Centering Styles
*
* A small CSS snippet for all your demo needs.
* If you have a demo on a small bit of design (such as: http://iainspad.github.io/quotation-block/), you may want perfect centering.
* Using automatic margins and CSS transform, you can center anything!
* http://zerosixthree.se/vertical-align-anything-with-just-3-lines-of-css/ — CSS Vertical Alignment by zerosixthree.se
*
**/


/**
*
* Body Element
*
* Since the body is only ever as tall as whatever is inside it, it needs a height of 100vh to cover the height of the window.
*
**/
body {
	height: 100vh;
}

/**
*
* The element holding the demo
*
* Uses an auto margin for horizontal centering.
* Vetical centering is done using relative positioning, 50% from the top, and translateY(-50%) to pull the element back up to the center.
*
**/
.demo {
	width: 500px;

	/* Vertical and Horizontal Centering */
	margin: 0 auto;
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}