Scroll Snap Tutorial

Welcome to the scroll snap Tutorial!

To understand what CSS scroll snap does, just try to scroll to left or to the right. If it works like normal scrolling your browser probably doesn't support CSS scroll snap.

To understand how CSS scroll snap works, I added three iframes of MDN docs that explain the most essential part of the new standard. Also these articles contain some examples themselves. Additionally you can find a very simple and clear setup of CSS snap scroll in the CSS tab of this code!

scroll-snap-type

scroll-snap-stop

scroll-snap-align

CSS scroll snap tutorial