css - 我应该如何处理“分屏”设计？

Question

我需要设计一个分为两个“可滚动”部分的网站。有左侧和右侧。他们都需要彼此独立滚动。

我应该如何处理这个？我不精通 JavaScript，如果可能的话，我想使用仅 CSS 的方法。纯 JavaScript 或 jQuery 也可以作为最后的手段。

这仅适用于大型平板电脑和台式机，因为布局将诉诸移动设备上的两个静态按钮。

编辑：我编辑了以下小提琴，但似乎无法“隐藏”垂直滚动条。我想保持下面的设计，但仍然有独立的滚动功能。

小提琴

html, body {
overflow: hidden;
}

div.container {
height: 100vh;
width: 49%;
display: inline-block;
background-color: #ccc;
overflow-y: hidden;
padding: 0;
}

.section {
height: 100vh;
overflow: auto;
}`