JSFiddle - React, Tailwind, and code Playground

HTML

<div class="login-signup-page">
<div class="login-signup">d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br></div>
</div>

CSS

/* Don't Change - Positioning */
.login-signup-page {
 margin:auto;
 position:fixed;
 top:0;
 -moz-transform:translate(0, 50%);
 -webkit-transform:translate(0, 50%);
 -ms-transform:translate(0, 50%);
 -o-transform:translate(0, 50%);
 transform:translate(0, 50%);
 height:100%;
 width:100%;
}
.login-signup {
 max-height:100%;
 max-width:100%;
 overflow:auto;
 background:orange;
 -moz-transform:translate(0, -50%);
 -webkit-transform:translate(0, -50%);
 -ms-transform:translate(0, -50%);
 -o-transform:translate(0, -50%);
 transform:translate(0, -50%);
}