CSS position:sticky

Keeps elements positioned as "fixed" or "relative" depending on how it appears in the viewport. As a result the element is "stuck" when necessary while scrolling.

Chrome

4 - 22: Not supported
23 - 36: Disabled by default
37 - 51: Not supported
52 - 55: Disabled by default
56 - 90: Partial support
91 - 116: Supported
117: Supported
118 - 120: Supported

Edge

12 - 15: Not supported
16 - 18: Partial support
79 - 90: Partial support
91 - 116: Supported
117: Supported

Safari

3.1 - 6: Not supported
6.1 - 7: Partial support
7.1 - 12.1: Supported
13 - 16.5: Supported
16.6: Supported
17.0 - TP: Supported

Firefox

2 - 25: Not supported
26 - 31: Disabled by default
32 - 58: Partial support
59 - 116: Supported
117: Supported
118 - 120: Supported

Opera

9 - 38: Not supported
39 - 41: Disabled by default
42 - 77: Partial support
78 - 101: Supported
102: Supported

IE

5.5 - 10: Not supported
11: Not supported

Chrome for Android

117: Supported

Safari on iOS

3.2 - 5.1: Not supported
6 - 7.1: Partial support
8 - 12.5: Supported
13 - 16.6: Supported
17.0: Supported
17.1: Supported

Samsung Internet

4 - 5.4: Not supported
6.2 - 21: Supported
22: Supported

Opera Mini

all: Not supported

Opera Mobile

10 - 12.1: Not supported
73: Supported

UC Browser for Android

15.5: Supported

Android Browser

2.1 - 4.4.4: Not supported
117: Supported

Firefox for Android

117: Supported

QQ Browser

13.1: Partial support

Baidu Browser

13.18: Supported

KaiOS Browser

2.5: Partial support
3: Supported

Any ancestor between the sticky element and its user-scrollable container with overflow computed as anything but visible/clip will effectively prevent sticking behavior.

Resources:: MDN Web Docs - CSS position; HTML5Rocks; Polyfill; Another polyfill; geddski article: Examples and Gotchas; WebPlatform Docs