CSS Scroll Snap demo
The scroll-snap-type CSS property sets how strictly snap points are enforced on the scroll container in case there is one.
scroll-snap-type: none | [ x | y | block | inline | both ] [ mandatory | proximity ]
/* Optional mandatory | proximity*/
scroll-snap-type: x mandatory;
scroll-snap-type: y proximity;
scroll-snap-type: both mandatory;The inner container must also have the following style
scroll-snap-align: center;Final
.container {
scroll-snap-type: y mandatory;
}
.child {
scroll-snap-align: start;
}