Some people use this responsive CSS to avoid horizontal scrolling on mobile phones:
body, html { overflow-x:hidden; }
But I find that it causes the vertical scroll bar to disappear on Android phones. This was the case on an Samsung Galaxy S3. So, I don’t use overflow-x:hidden
for responsive web design.
Instead, I use the following. If the rest of your code is decent, as in no widths exceeding 100%, and you have your viewport meta tag in place, then the following CSS avoids the horizontal scrolling.
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
Questions and Comments are Welcome