Workaround to enable scrolling in overflowing divs in Android browsers

The other day while working on a mobile website at work we discovered an odd issue that affects Android users. On one of the mobile website’s pages there is a modal popup that has a scrollable div. In Mobile Safari you can scroll the contents of the div as expected, but it did not scroll in the Android browser.

After some research I discovered a Javascript workaround in a blog post by Chris Barr.

Scrolling a overflow:auto; element on a touch screen device

I added the Javascript to the page and it fixed the problem. In future though, I would probably avoid having scrollable divs in mobile web pages to avoid the issue. I also think they can cause some confusion when you scroll to the end of the content within the div and begin scrolling the page.