Question

I have a page where I do not want the user to be able to scroll. In order to prevent it, I just set the body to have a hidden overflow style. This is sufficient up until the point where a user tries to select some text and then drags to the bottom. The window then scrolls with the users dragging. How can I prevent this?

Answer 1

use position: fixed;. If you want the whole body to be non-scrollable:

body
{
  position: fixed;
}

EDIT: after receiving the comment from user Sam, I’ve decided to go back and test this method once again. Now that I reconsider it and Sam’s concern that it would mess with styles, I’ve come to the conclusion that the following would be a better solution:

html
{
  position: fixed;
  width: 100%;
  height: 100%;
}

The prevents some sites (stackoverflow included) from ending up left aligned. It also uses the highest node available, which should have been done in the first place.