JSFiddle - React, Tailwind, and code Playground

by Qwerty_Wasd

HTML

<header class="header"></header>
<main class="content"></main>
<footer class="footer"></footer>

CSS

*,
*:after,
*:before {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0;
  margin: 0;
  outline: 0;
}
/*стили выше добавлены только для этого примера, в реальном проекте используйте normalize.css\reset.css*/
html,
body,
div {
  width:100%;
  font-weight:bolder;
}
.header {
  height:100px;
  background:red;
}
.content {
  min-height:calc(100vh - 200px);
  background:green;
}
.footer{
  height:100px;
  background:blue;
}