CSS Center of the Universe

A method of centering content both vertically and horizontally.

by bseib

HTML

<body>
    <div class="center-of-universe">
        <div>
            <div>
                <div>
                    <h1>Wow.</h1>
                    <h2>This content</h2>
                    <p>could not be more uninteresting.</p>
                </div>
            </div>
        </div>
    </div>
</body>

CSS

.center-of-universe > div {
	    position: absolute;
	    bottom: 0;
	    top: 0;
	    left: 0;
	    right: 0;
	    margin: 0;
	}
	.center-of-universe > div > div {
	    display: table;
	    height: 100%;
	    width: 100%;
	}
	.center-of-universe > div > div > div {
	    display: table-cell;
	    text-align: center;
	    vertical-align: middle;
	}