Prevent 100vw from creating horizontal scroll

Question

If an element is set to width: 100vw; and there is a vertical scrollbar the width of the element will be equal to the viewport plus the width of the scrollbar.<

Answer 1

Using max-width attribute with width:100vw and it solved my problem.

Here's what i used.

.full{
     height: 100vh;
     width: 100vw;
     max-width: 100%;
    }

Basically what it does is it fixes the max width to the viewport so the horizontal scroll gets eliminated.

More @ https://www.w3schools.com/cssref/pr_dim_max-width.asp

The max-width property defines the maximum width of an element.

If the content is larger than the maximum width, it will automatically change the height of the element.

If the content is smaller than the maximum width, the max-width property has no effect.