CODEWITHSUNDEEP
cssscrolloverflow
Walrus
Walrus

Reputation: 20484

Disable Horizontal Scroll on Div

There is a cross browser dilemma especially now that safari uses an internal scroll mechanism that floats on top.

When a div with fixed height's content ends up getting larger than the div we need a scroll bar, but the scrollbar takes out some width and thus a horizontal bar is added to. How do we prevent a horizontal scroll even if the content is to wide I want no ability for the user to be able to scroll horizontally.

The CSS3 property overflow-x:hidden, still allows the user to scroll left and right with a trackpad. I want it disabled completely, or a solution that removes the problem of the vertical scroll bar taking width from the div.

Any ideas?

Marvellous

Upvotes: 7

Views: 12903

Answers (2)

Ben
Ben

Reputation: 13645

Set the image as background should fix your issues

Upvotes: 0

qingbo
qingbo

Reputation: 2160

One solution is that you make the vertical scroll bar always display:

overflow-y: scroll

But still the scroll bar's width doesn't stay the same across browsers.

Or you can make a custom scroll bar replacement with div/CSS/JavaScript. Here is a jQuery plugin which seems promising:

http://jscrollpane.kelvinluck.com/

Upvotes: 2

Related Questions