CSS | Hide Overflow Vertical Scrollbar

When you set a div style like this:

width: 600px;
overflow: auto;

it will show both the horizontal and vertical scrollbars if the content is large enough to require them.

However in IE due to a bug, you can still see them.

The solution would be to use the following css styling to hide the vertical scrollbar:

overflow: auto;
overflow-y: hidden;


overflow-x: hidden; (to hide the horizontal scrollbar)

IE6-7 (amongst other browsers) supports the proposed CSS3 extension to set scrollbars independently, which you could use to suppress the vertical scrollbar:

You may also need to add for IE8:

-ms-overflow-y: hidden; (hides vertical scrollbar)


-ms-overflow-x: hidden; (hides horizontal scrollbar)

as Microsoft are threatening to move all pre-CR-standard properties into their own ‘-ms’ box in IE8 Standards Mode.

Happy overflowing!! 🙂

Resources: here


One thought on “CSS | Hide Overflow Vertical Scrollbar

  1. kranthi kumar says:

    Yes , It’s correct Ans
    but you must write the css style in head tags like

    overflow-x: hidden;
    -ms-overflow-x: hidden;


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s