Hi folks! I threw together a Codepen to demo using
position: sticky to "stick" section headers to the side of the screen while scrolling long blocks of content.
This layout pattern could be used for a list of blog posts, comments on a single blog post, or for keeping share buttons in view on long article pages. It could also be used for an instant messaging layout to "stick" a user's profile picture next to their message.
On mobile screen sizes, the headers stack vertically but stay sticky at the top of the screen.