Section one
Section two
Section three
.scroller { height: 300px; overflow-y: scroll; scroll-snap-type: y mandatory; } .scroller section { scroll-snap-align: start; }
<article class="scroller"> <section> <h2>Section one</h2> </section> <section> <h2>Section two</h2> </section> <section> <h2>Section three</h2> </section> </article>