JSFiddle - React, Tailwind, and code Playground

HTML

<div class="header">header</div>
<div class="content">
<div class="main-content">
<ul>
<li>Lorem ipsum dolor sit amet,</li> <li>consectetuer adipiscing elit</li>, <li>sed diam nonummy nibh euismod</li> <li>tincidunt ut laoreet dolore magna</li><li> aliquam erat volutpat.</li> <li> Ut wisi enim ad</li><li> minim veniam, </li> <li>quis nostrud exerci tation</li> ullamcorper suscipit lobortis nisl ut <li>aliquip ex ea commodo consequat. </li> <li> Duis autem vel eum iriure </li> <li> dolor in hendrerit in </li> <li>vulputate velit esse molestie </li> <li> consequat, vel </li> <li> illum dolore eu </li> <li> feugiat nulla facilisis </li> <li> at vero eros </li>  <li>et accumsan </li> <li> et iusto odio </li> <li> dignissim qui blandit </li> <li> praesent luptatum </li> <li> zzril delenit augue </li> <li> duis dolore te </li> <li> feugait nulla </li> facilisi. <li>Nam liber tempor </li> <li> cum soluta nobis eleifend </li> <li> option congue nihil </li> <li> imperdiet doming </li> <li> id quod mazim placerat </li>
<li>Lorem ipsum dolor sit amet,</li> <li>consectetuer adipiscing elit</li>, <li>sed diam nonummy nibh euismod</li> <li>tincidunt ut laoreet dolore magna</li><li> aliquam erat volutpat.</li> <li> Ut wisi enim ad</li><li> minim veniam, </li> <li>quis nostrud exerci tation</li> ullamcorper suscipit lobortis nisl ut <li>aliquip ex ea commodo consequat. </li> <li> Duis autem vel eum iriure </li> <li> dolor in hendrerit in </li> <li>vulputate velit esse molestie </li> <li> consequat, vel </li> <li> illum dolore eu </li> <li> feugiat nulla facilisis </li> <li> at vero eros </li>  <li>et accumsan </li> <li> et iusto odio </li> <li> dignissim qui blandit </li> <li> praesent luptatum </li> <li> zzril delenit augue </li> <li> duis dolore te </li> <li> feugait nulla </li> facilisi. <li>Nam liber tempor </li> <li> cum soluta nobis eleifend </li> <li> option congue nihil </li> <li> imperdiet doming </li> <li> id quod mazim placerat </li>
<li>Lorem ipsum dolor sit...

CSS

html, body {
  padding:0;
  margin:0;
  height: 100%;
  width: 100%;
}

.header {
   position:fixed;
   text-align:center;
   overflow: hidden;
    height:200px;
   top:0;
   left:0;
   right:0;
   font-weight : bold;
font-size: 18px;
font-family: "Arial"
}

.footer {
   position:absolute;
   height:70px;
   bottom:0;
   right:0;
   overflow: hidden;
}
.content {
position : absolute;
top: 110px;
bottom:110px;
left: 0;
right: 0;
overflow: auto;
}

@media all and (min-width: 900px)
{
.main-content {
-moz-column-count: 4;
-webkit-column-count: 4;
}
}