I came across an issue with one of our web sites:

In IE9 the page had a vertical scrollbar, but you couldn't use the mousewheel, arrow keys, pgup/pgdwn to scroll. The only way to scroll was to actually click/hold and move the scrollbar.

I removed the following from the css:

{
    overflow-x: hidden;
}

Then scrolling worked as usual. Has anyone else come across this? It seems odd as overflow-x should hide the horizontal scroll bar? Why would it effect the vertical?

I have tried this on a test page and it acts as expected. So it must be a combination of things.

share|improve this question
1  
"*I have tried this on a test page and it acts as expected. So it must be a combination of things." - unless someone has come across this before, we need a test page that reproduces the problem. You can either post a link to the site, or take a copy of the page yourself and anonymise it and have all the required CSS (and any JavaScript relevant to the problem) included and post it on JS Bin. – thirtydot Sep 7 '11 at 14:29
    
Apologies, I don't have permission to post a link to the materials themselves (they are subscription only). This was mainly out of interest, as I have managed to fix the issue, its just I don't understand why the fix worked. Unfortunately I can't simply upload a page as it is part of an e-learning system. – Sheff Sep 7 '11 at 14:35

I use iFrame to insert the content from another page and CSS mentioned above is NOT working as expected. I have to use the parameter scrolling="no" even if I use HTML 5 Doctype

share|improve this answer

Try using the following code snippet. This should solve your issue.

body, html { 
    overflow-x: hidden; 
    overflow-y: auto;
}
share|improve this answer

overflow-x: hidden;
would hide any thing on the x-axis that goes outside of the element, so there would be no need for the horizontal scrollbar and it get removed.

overflow-y: hidden;
would hide any thing on the y-axis that goes outside of the element, so there would be no need for the vertical scrollbar and it get removed.

overflow: hidden;
would remove both scrollbars

share|improve this answer
    
Isn't it the other way around? overflow-y controls the vertical scrollbar: jsfiddle.net/ddVTk – user2019515 Jan 20 '14 at 23:18

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.