What if height: 100vh is bigger than your screen?

It happens to all of us. You set a div to height: 100vh and suddenly you realize that it stretches beyond the lower end of your screen on mobile. The correct value would be something nuts like 92.3354vh, but you’re a strong independent woman who needs no bullshit, so let’s find something else. Besides the correct value actually depends on the height of your browser’s top bar, so there’s no single correct height value.

So this is what you should do:

body, html {
  height: 100%;
  width: 100%;
  margin: 0;
}
.full-screen-div {
    width: 100vw;
    height: 100%;
    min-height: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: hidden;
}

And… that’s it.