JSFiddle - React, Tailwind, and code Playground

HTML

<div class="content">
    <h1>Hey, what's up?</h1>
</div>

<div class="footer">
</div>

CSS

body {
    background: #eee;   
}

.content {
    padding: 20px;
    background: #fff;   
}

/* I don't want this div to trigger a scrollbar when the viewport is shrunk */
.footer {
    height: 120px;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee') !important; /* for IE */
    background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#eeeeee)) !important; /* for webkit browsers */
    background: -moz-linear-gradient(top,  #ffffff,  #eeeeee) !important; /* for firefox 3.6+ */ 
}