Solved: Element inside overflow:scroll container cannot be scrolled on iOS when dragged by a contained iframe

Imagine the following HTML structure, where the scrolling container has overflow-y: scroll:

+--scrolling container+-+
|                       |
| +-child element+----+ |
| | ++iframe++        | |
| | |        |        | |
| | |        |        | |
+-----------------------+
  | |        |        |   <-- actually cut off by
  | +--------+        |   <-- scrolling container
  +-------------------+

The issue: On iOS, the child element cannot be scrolled when grabbing the iframe (i.e. putting your finger somewhere on the iframe).

Solution

You need to add -webkit-overflow-scroll: touch on the element that has overflow:scroll, i.e. the scrolling container. This activates "momentum scrolling" for this container, but also fixes the iframe scrolling issue.