Using CSS position: sticky
Sticky positioning is the last CSS Positioning type. It was introduced about 4 years ago, and has only recently garnered enough browser support to be feasible to use. I think because of this it gets forgotten as a viable choice in the design process but it can be especially useful to display large indexes or directories.
Sticky positioning does what is sounds like, it sticks. Its like a cross between in-line and absolute positioning. It originally assumes its inline position, however on scrolling, instead of scrolling up or down the page with the rest of the content, it will stick to a specific absolute position relative to its container.
Source: The Basics of CSS Positioning. Positioning elements with CSS is easy - by Lydia Gregory - Medium
I didn’t realize
position: sticky was ready for prime-time use. That’s great!