<script src="https://cdn.tailwindcss.com"></script>

<script type="text/javascript">
  tailwind.config = {
    theme: {
      extend: {
        gridTemplateRows: {
          pancake: 'auto 1fr auto',
        }
      }
    }
  }
</script>

<div class="grid grid-rows-pancake h-screen w-full">
  <header class="bg-blue-200" contenteditable>Header</header>
  <main class="bg-red-200 overflow-auto" contenteditable>Main</main>
  <footer class="bg-purple-200" contenteditable>Footer Content</footer>
</div>