Html css：滚动问题

我在这一页有三个独立的部分。每个都应该单独滚动。如果我们滚动整个页面，每个div都应该滚动

如何做到这一点。下面是小提琴

---

我在JSFIDLE上做了一个小模型，您需要给boxs一个定义的高度和scroll的溢出属性。同样，你也不需要为了实现这一点而随意地浮动你的箱子

：：编辑：：： 更新了用于页面滚动的Js提琴

*{
框大小：边框框；
}
科尔斯先生{
浮动：左；
宽度：33%；
溢出：滚动；
高度：30px；
}
.左栏{
背景：红色；
}
.中柱{
背景：蓝色；
}
.右栏{
背景：绿色；
}

第一组
第一组
第一组
第二组
第二组
第二组
第三组
第三组
第三组

我想这就是你要找的

CSS

html，正文{
身高：100%；
位置：相对位置；
}
身体
{
背景：#00253f；
线高：100px；
文本对齐：居中；
}
左边
{
位置：绝对位置；
左缘：5%；
利润率最高：3%；
显示：块；
身高：80%；
宽度：20%；
背景：ddd；
溢出：滚动；
}
居中
{
位置：绝对位置；
左边缘：25%；
利润率最高：3%；
显示：块；
身高：80%；
宽度：50%；
背景：#ccc；
溢出：滚动；
}
.对
{
位置：绝对位置；
左边缘：75%；
利润率最高：3%；
显示：块；
身高：80%；
宽度：20%；
背景：ddd；
溢出：滚动；
}

重复问题可能重复！！！页面滚动呢？页面不会滚动，因为没有可滚动的内容。您可以添加固定的像素高度或最小高度（如2000px），如果我们到达一个滚动区域的末尾，页面就会滚动。主体开始滚动。我怎样才能防止这种情况发生呢？要做到这一点，你需要JavaScript。

html{
 overflow-x:hidden;
}
.left-column
 {
    float:left;
    width:30%;

 }
 .right-column
  {
    float:right;
    width:30%;

  }
  .center-column
  {
    margin:auto;
    width:30%;

  }