JSFiddle - React, Tailwind, and code Playground

by Jaybles

HTML

<div id='bodyDiv'>

    <div id="centeredContent"></div>

</div>

CSS

body{
    padding:0px;
}
#bodyDiv{
    background:#666;
}
#centeredContent{
    width:95%;
    position:relative;
    height:100px;
    background:#fff;
    margin:auto;
}

JavaScript

redoCenter();
$(window).resize(redoCenter;
function redoCenter(){
    $('#bodyDiv').height($(window).height()).width($(window).width());
    var h = ($(window).height() - $('#centeredContent').height())/2;
    $('#centeredContent').css({'top': h + 'px'});
}