JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<meta name="keywords" content="dayz, dayz standalone, chipotle bandits">
		<meta name="description" content="The official website of The Chipotle Bandits community">
		<link rel="stylesheet" type="text/css" href="css/styles.css">
		<title>The Chipotle Bandits</title>
	</head>
	<body>
		<nav>
			<ul>
				<li><a href="index.html">Home</a></li><li><a href="events.html">Events</a></li><li><a href="rules.html">Rules</a></li><li><a href="map.html">Map</a></li><li><a href="community.html">Community</a></li><li><a href="reports.html">Reports</a></li>
			</ul>
		</nav>
		<div>
			<p>Pleased him another was settled for. Moreover end horrible endeavor entrance any families. Income appear extent on of thrown in admire. Stanhill on we if vicinity material in. Saw him smallest you provided ecstatic supplied. Garret wanted expect remain as mr. Covered parlors concern we express in visited to do. Celebrated impossible my uncommonly particular by oh introduced inquietude do. She exposed painted fifteen are noisier mistake led waiting. Surprise not wandered speedily husbands although yet end. Are court tiled cease young built fat one man taken. We highest ye friends is exposed equally in. Ignorant had too strictly followed. Astonished as travelling assistance or unreserved oh pianoforte ye. Five with seen put need tore add neat. Bringing it is he returned received raptures. Betrayed cheerful declared end and. Questions we additions is extremely incommode. Next half add call them eat face. Age lived smile six defer bed their few. Had admitting concluded too behaviour him she. Of death to or to being other. Another journey chamber way yet females man. Way extensive and dejection get delivered deficient sincerity gentleman age. Too end instrument possession contrasted motionless. Calling offence six joy feeling. Coming merits and was talent enough far. Sir joy northward sportsmen education. Discovery incommode...

CSS

html {
	position: relative;
	min-height: 100%;
}

nav {
	text-align: center;
}

nav ul {
	list-style: none;
	text-align: center;
	margin: 0;
	padding: 0;
	background-color: #2a2a2a;
}

nav li {
	display: inline-block;
}

nav li a {
	display: block;
	color: white;
	padding: 16px 16px;
	text-decoration: none;
	font-size: 20px;
}

body {
	margin: 0;
	font-family: arial;
	background-color: #363636;
	padding: 0px;
	display: flex;
	flex-direction: column;
}

li a:hover {
	background-color: #1e1e1e;
}

p {
	color: grey;
}

textarea {
	resize: vertical;
	width: 400px;
	margin: 10px;
	padding: 0px;
	font-family: arial;
}

.report_form {
	width: 400px;
	clear: both;
	margin: 10px;
	font-family: arial;
}

.report_form input {
	width: 100%;
	clear: both;
	margin: 10px;
	font-family: arial;
}

.footer {
	color: white;
	text-align: center;
	font-size: 12px;
	position: absolute;
	bottom: 0;
	width: 100%;
	flex: 0 0 50px;
}