Some Header

Filling Vertical Space with Flexbox

This is some content where the height grows as needed

The container div has the following css with the height calculated to remove the site header.


  display: flex;
  height: calc(100vh - 92px);
  flex-direction: column;

        

This main element has flex-grow: 1; set and grows to fill the empty space. See the blue boarder going down to the footer.