html - div 内容超出视口高度

Question

这就是问题所在。我正在使用我在这里找到的 CSS 视差方法http://keithclark.co.uk/articles/pure-css-parallax-websites/。

问题是，我有一个部分的内容超过了所有 div 设置的 100% 视口高度。如何使我的 div 消耗以显示其所有内容而不仅仅是视口高度？在下一个div下滑动的超出内容

这是一个例子https://codepen.io/Dwoop/pen/LOgLRw?editors=1100

.parallax {
height: 500px; /* fallback for older browsers */
height: 100vh; /* standard divs size that cannot expend */
overflow-x: hidden;
overflow-y: auto;
-webkit-perspective: 300px;
perspective: 300px;
-webkit-perspective-origin-x: 100%;
perspective-origin-x: 100%;}

为什么我的第一个 div (#group1) 不适应我的内部 div 高度？再加上这里的第一个 div 甚至比视口还小……我真的不明白这些高度设置是如何工作的。

任何帮助都可以