86

Is it possible to allow only a horizontal scroll bar when using overflow:auto (or scroll)?

  • Note that margin-bottom with a negative value will mess with overflow-y: hidden etc. – Andrew Apr 3 at 17:09
  • thank you for this comment. I've been searching all over trying to figure out why in the world my division was still scrolling with overflow off. This finally fixed it for me! – Chris Hitchcock Jul 19 at 20:05
186

These two CSS properties can be used to hide the scrollbars:

overflow-y: hidden; // hide vertical
overflow-x: hidden; // hide horizontal
  • nice! hoped it would be that simple, but couldn't find anything online. will set as answer after the timeout. – jdborg Oct 4 '11 at 10:37
  • 1
    I'm glad to have helped! – Luke Oct 4 '11 at 10:39
  • im glad to have read it!! – Juan Sep 6 '13 at 14:41
  • 4
    I'm glad to read the reviews, that's for sure! :) – Luke Jan 4 '14 at 22:43
  • 3
    Worth mentioning that you can still scroll in the div using tab, provided there are links or input elements in the hidden overflow – William Brochmann Aug 3 '16 at 16:30
0

Add the following:

body{
overflow-y:hidden;
}
8

If you want to accomplish the same in Gecko (NS6+, Mozilla, etc) and IE4+ simultaneously, I believe this should do the trick:V

body {
overflow: -moz-scrollbars-vertical;
overflow-x: hidden;
overflow-y: auto;
}

This will be applied to entire body tag, please update it to your relevant css and apply this properties.

36

You should use only

overflow-y:hidden; - Use this for hiding the Vertical scroll

overflow-x:auto; - Use this to show Horizontal scroll

Luke has mentioned as both hidden. so I have given this separately.

18

overflow: auto;
overflow-y: hidden;

For IE8: -ms-overflow-y: hidden;

Or Else :

To hide X:

<div style="height:150x; width:450px; overflow-x:hidden; overflow-y: scroll; padding-bottom:10px;"></div>

To hide Y:

<div style="height:150px; width:450px; overflow-x:scroll ; overflow-y: hidden; padding-bottom:10px;"></div>
  • 3
    Thanks for the IE fix. – jdborg Oct 4 '11 at 10:58
  • 1
    You are welcome :) – Random Guy Oct 4 '11 at 11:02

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

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