JSFiddle - React, Tailwind, and code Playground

HTML

<div class="hor-nav">test</div>
<div class="main">
  <div class="page">test</div>
</div>

CSS

body {
  display: flex;
  flex-flow: column;
}
.hor-nav {
  background-color: #666;
  color: white;
  height: 64px;
}
.main { }

.page {
  border: 1px solid black;
  margin: 16px;
  height: calc(100vh - 32px - 64px);     /* height, less margin, less nav height */
  width: calc(80vh - 32px - 64px);
}