JSFiddle - React, Tailwind, and code Playground

by gcjnst

HTML

<div id="box2">
	<p id="informationBox">
heyheyhey
	</p>
</div>

CSS

body {padding:0px; margin:0px;}
#box2 {

	width: 100%;
	height: 100%;
	position:absolute;
	background-color: orange;

}


			#informationBox {

			padding: 0.5em;
			background-color: #fff;
			border-radius: 12pt;
			border: solid black 3pt;
			max-width: 100px;
			margin: 0 auto;
			text-align: center;
		}

JavaScript

var container = document.getElementById("box2");
var inner = document.getElementById("informationBox");
var inHeight = inner.offsetHeight;
container.style.height=(window.innerHeight);
container.style.width=window.innerWidth;
var conHeight=container.offsetHeight;
alert(conHeight);
inner.style.marginTop = (conHeight-inHeight)/2+'px';