即使滚动也无法看到页面的全部内容

Question

尝试向下滚动时显示此页面上的最后一张卡片。当前，页脚正在使用main类阻止article元素中最后一张卡片的底部。我为主类添加了以下CSS，但仍在向下滚动时看不到最后一张卡片的底部。我该如何解决。谢谢。整个项目可见here。

.main {
    grid-area: main;
    padding: 5px;
    border-left: 1px solid gray;
    padding-left: 50px;
    padding-right: 50px;
    margin-top: 20px;
    height: 100%;
}

Answer 1

添加margin-bottom

.main {
    grid-area: main;
    padding: 5px;
    border-left: 1px solid gray;
    padding-left: 50px;
    padding-right: 50px;
    margin-top: 20px;
    height: 100%;
    margin-bottom: 75px;
}