JSFiddle - React, Tailwind, and code Playground

HTML

<body>

<div id="head">
	<form action="test.asp" style="position: absolute; right: 0; margin-right: 3%;">
        <input type="text" />
	</form>
	<h1> Title </h1>
</div>

<nav>
<a href=""> NAV MENU </a>
</nav>

<div id="leftColumn">
<ul>
	<li>hi</li>
	<li>hi</li>
	<li>hi</li>
	<li>hi</li>
	<li>hi</li>
	<li>hi</li>
	<li>hi</li>
	<li>hi</li>
	<li>hi</li>
	<li>hi</li>
	<li>hi</li>
	<li>hi</li>
	<li>hi</li>
	<li>hi</li>
	<li>hi</li>
	<li>hi</li>
	<li>hi</li>
	<li>hi</li>
	<li>hi</li>
	<li>hi</li>
	<li>hi</li>
</ul>
</div>

<div...

CSS

body {
	background-color: blue;
	position: fixed;
	height: 100%;
	width: 100%;
}

nav {
	margin: 2% auto;
	text-align: center;
}

a {
	color: black;
}

#head {
	margin: 2% auto 2% auto;
	text-align: center;
}

#head h1 {
	display: inline;
}

#leftColumn {
	width: 10%;
	margin: 1% 1% 0 1%;
	float: left;
	background-color: red;
}

#middleColumn {
	width: 66%;
	margin: 1% 1% 0 1%;
	float: left;
	background-color: yellow;
}

#rightColumn {
	width: 10%;
	margin: 1% 1% 0 1%;
	float: left;
	background-color: green;
}