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

I had the same issue and it was fixed when I added:

html, body { overflow-y: auto; }

I added the comment:

/* this fixes a 100vw issue, removing the horizontal scrollbar when it's unneeded */

It works at least with Firefox, Chrome, Opera and Internet Explorer 11 (I used browserling for IE).

I don't know why it works and if it works in all cases, though.

EDIT: The horizontal scrollbar disappeared, but I noticed it's still horizontally scrollable using the cursor keys and touch screens...