html - Use flexbox to force div to fill up remaining height of page

Question

This question already has answers here: question from:https://stackoverflow.com/questions/65852596/use-flexbox-to-force-div-to-fill-up-remaining-height-of-page

Answer 1

Make the fill-height div use all the available space min-height: 100%;, but hey, there is no space to fill, well, height: 100vh; takes care of that.

body {
  height: 100vh;
}

.fill-height {
  display: flex;
  flex-direction: column;
  min-height: 100%;
}