css scroll snap

1.container {
2  scroll-snap-type: mandatory; 
3}
4
5.child {
6  scroll-snap-align: start;
7}
8
9/* Guide: https://css-tricks.com/practical-css-scroll-snapping/ */

1.parent-container {
2  scroll-snap-type: y mandatory;
3  overflow-y: scroll;
4}
5
6.child-containers {
7  height: 100vh;
8  scroll-snap-align: start;
9}

1/* Answer to: "scroll snap css" */
2
3/*
4  CSS Scroll Snap is a module of CSS that introduces scroll snap positions,
5  which enforce the scroll positions that a scroll container’s scrollport may
6  end at after a scrolling operation has completed.
7
8  Here's two guides on how to use this module:
9  - https://blog.logrocket.com/how-to-use-css-scroll-snap/
10  - https://css-tricks.com/practical-css-scroll-snapping/
11*/