DISABLE the Horizontal Scroll

user2371301 picture user2371301 · Jul 20, 2013 · Viewed 398.5k times · Source

Ok for some reason my webpage scrolls from left to right and shows a lot of ugly space.

I have searched for results but they just made the scrollbar HIDDEN

That's now what I want, I want to physically DISABLE the horizontal scroll feature. I do not want the user to be able to scroll left to right on my page just up and down!

I have tried: overflow-x:hidden in css on my html tag but it only made the scrollbar hidden and did not disable the scroll.

Please help me!

Here is a link to the page: http://www.green-panda.com/usd309bands/ (Broken link)

This might give you a better idea of what I am talking about:

This is when the first pages loads:

enter image description here

And this is after I scroll to the right:

enter image description here

Answer

koala_dev picture koala_dev · Jul 20, 2013

Try adding this to your CSS

html, body {
    max-width: 100%;
    overflow-x: hidden;
}