CSS滚动页面很长

Question

我目前正在开发移动网站，这是桌面网站的简化版本。我开发了一个移动网页，您可以按一个按钮滚动到网页的下一部分。但是，一旦到达第2页的底部，页面就会停止滚动。然而，滚动继续，关于如何限制滚动量的任何建议或想法将被理解。

HTML：

<scroll-container>
    <scroll-page id="page1">
        {content}
    </scroll-page>
    <scroll-page id="page2">
        {content}
    </scroll-page>
</scroll-container>

CSS：

scroll-container 
{ 
     display: block; 
     width: 100%; 
     height: 100%; 
     overflow-y: scroll; 
     margin: auto; 
}

scroll-page 
{ 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    height: 640px; 
    width: 100%; 
    position: relative;
    margin:0 auto 0 auto; 
}

First page Unwanted white space under page 2