JSFiddle - React, Tailwind, and code Playground

by Kenneth Luplau-Brøgger

HTML

<div class="tjekliste-hele-siden">
  <div class="tjekliste-header">Header</div>
  <div class="tjekliste-content">
    <div class="feature-box">
      <h1>Indhold</h1>
    </div>
  </div>
</div>

SCSS

.tjekliste-hele-siden {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  
  .tjekliste-header {
    background: red;
  }

  .tjekliste-content {
    background: blue;
    padding: 20px;
    align-content: stretch;
    flex: 1;
    display: flex;
    align-items: center;
  }

  .feature-box {
    background: white;
    flex: 1;
    height: 50vh;
    width: 100px;
  }
}