When using “height: 100vh” for the container, vertical scrollbar appears

Question

I want the content to take the full height of the browser window, but not beyond.

When using 100vh as the container height, I can see the vertical scrollbar appearin

Answer 1

By default body and html are assigned to margin or padding to some pixels. Try using following code.

1vh = 1% of veiwport height 100vh = 100% of height.

So never calculate height - 3px. like this

body,html {
    margin: 0;
    padding: 0;
}
* {
    box-sizing: border-box;
}