Andrew M
Andrew M

Reputation: 4288

Limit webkit-overflow-scrolling

I have a div that needs to scroll horizontally. This works fine without -webkit-overflow-scrolling, but I don’t get the native bouncing on the iPhone. It only scrolls horizontally, not vertically, as I want.

When I add the CSS property and set it to touch, it scrolls horizontally as expected. However, it also scrolls vertically. The thing is, it looks like the scrollable area is the same as the viewable area – i.e., the content bounces in each direction, but there is no content that should make it scroll. Can I limit this scrolling to horizontal only?

Note: overflow-y is set to hidden, and overflow-x is scroll. I have verified in the web inspector that all elements have a height of 100px, so I don't believe that there are any elements that are causing the scrolling.

Upvotes: 3

Views: 2687

Answers (1)

Rajesh Hegde
Rajesh Hegde

Reputation: 2822

Have you tried this piece of code. This will enable scrolling.

overflow: auto;
-webkit-overflow-scrolling: touch;

OR

overflow: auto;
-webkit-overflow-scrolling: auto;

Now you should be able to scroll. If this is not what you exactly looking for then attach a sample page.

Upvotes: 2

Related Questions