html {
  box-sizing: border-box;
}

*,
*::before,
*::after {
  box-sizing: inherit;
}

html {
  box-sizing: border-box;
}

*,
*::before,
*::after {
  box-sizing: inherit;
}

html,
body {
  height: 100%;
}

Declare height on html and body
Declare height on html and body

This stretches the html and body elements to always be full height
within the viewport. It allows children to then also stretch the full
height of the viewport.

I think it aligns with most people's expected behavior.
