JSFiddle - React, Tailwind, and code Playground

HTML

<h1>OMG, I’m centered</h1>

CSS

html {
	height: 100%;  
} 

body {
	display: -webkit-box;	/* OLD: Safari,  iOS, Android browser,
                                    older WebKit browsers.  */
    display: -moz-box;	    /* OLD: Firefox (buggy) */ 
	display: -ms-flexbox;	/* MID: IE 10 */
	display: -webkit-flex; 	/* NEW, Chrome 21+ */
	display: flex; 		/* NEW: Opera 12.1, Firefox 22+ */

	-webkit-box-align: center; -moz-box-align: center; /* OLD… */
	-ms-flex-align: center; /* you know the drill now… */
	-webkit-align-items: center;
	align-items: center;

 	-webkit-box-pack: center; -moz-box-pack: center; 
	-ms-flex-pack: center; 
    -webkit-justify-content: center;
	justify-content: center;

	margin: 0;
	height: 100%;
    width: 100%; /* needed for Firefox */
} 

h1 {
	display: -webkit-box; display: -moz-box;
	display: -ms-flexbox;
    display: -webkit-flex;
	display: flex;
 
	-webkit-box-align: center; -moz-box-align: center;
	-ms-flex-align: center;
    -webkit-align-items: center;
	align-items: center;

	height: 10rem;
}