The Problem

On older iOS devices (iOS 12 and below), scrolling inside a div with overflow: auto oroverflow: scroll feels sluggish and unresponsive — it stops immediately when you lift your finger, like dragging a heavy object. The smooth deceleration ("momentum" or "inertia" scroll) that makes iOS feel fast is absent.

Product List
no momentum!

Choppy scroll without momentum (pre-iOS 13)

Root Cause

iOS uses a native UIScrollView for momentum scroll — the physics engine that decelerates scroll after a flick gesture. On pre-iOS 13, this native component was only activated for the main document scroll (<body>). Overflow containers in div elements used a synthetic, CSS-only scroll implementation that lacked inertia entirely.

The -webkit-overflow-scrolling: touch property was the opt-in to use native UIScrollView for a specific overflow container. iOS 13 made this the default for all overflow containers, making the property a no-op in modern iOS (but still harmless to include).

The Fix

scroll.css
/* Enable momentum scroll on overflow containers */
.scrollable-container {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch; /* legacy iOS 12: enables native UIScrollView */
}

/* Common use cases */
.sidebar,
.product-list,
.chat-messages,
.modal-body,
.drawer-content {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* On iOS 13+ this property is ignored — it's already the default.
   On iOS 12 and below, without it, scroll feels like dragging. */
Safe to include everywhere: Adding -webkit-overflow-scrolling: touch is harmless on modern iOS (13+) — the property is simply ignored since native scroll is already the default. Include it for broad compatibility without any downside.
Known side effect (iOS 12 and below): On older iOS, -webkit-overflow-scrolling: touchcan cause position: sticky elements inside the container to stop working. If you need both sticky positioning and momentum scroll on legacy iOS, you'll need a JavaScript workaround.

Browser Support

BrowserMin VersionStatusNotes
Safari iOS 13+13+SupportedMomentum scroll applied automatically — no CSS needed
Safari iOS 12 and below≤ 12PartialRequires -webkit-overflow-scrolling: touch on overflow containers
Chrome iOSAllSupportedSame WebKit engine — same native scroll behaviour
Chrome AndroidAllSupportedNative scroll used for all overflow containers
FirefoxAllSupportedNative scroll everywhere; property is not recognised

Further Reading