Markdown

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-css -->

    .container {
      overflow-y: scroll;
      overscroll-behavior-y: contain;
      scroll-snap-type: y mandatory;
    }

    .container > div > div:last-child {
      scroll-snap-align: end;
    }

    .container > div > div {
      background: lightgray;
      height: 3rem;
      font-size: 1.5rem;
    }
    .container > div > div:nth-child(2n) {
      background: gray;
    }

<!-- language: lang-html -->

    <div class="container" style="height:6rem">
    <div>
    <div>1</div>
    <div>2</div>
    <div>3</div>
    <div>4</div>
    <div>5</div>
    </div>
    </div>

<!-- end snippet -->