JSFiddle - React, Tailwind, and code Playground
HTML
<div class="wrap">
<div class="header">headerheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheaderheader</div>
</div>
CSS
* {
margin:0;
padding:0;
}
html, body {
width:100%;
height:100%;
margin:0;
padding:0;
}
body {
background:#fff;
color:#000;
font:12px Arial, Verdana, Tahoma, Helvetica;
}
.wrap {
width:400px;
height:auto !important;
height:100%;
min-height:100%;
background:red;
margin:auto;
position:relative;
}
.header {
height:100px;
background:blue;
}