左右两栏各自滚动

圣杯布局？

背景

项目中需要在一个div中使用一个左右两栏布局，且左右各拥有纵向滚动条。

首先，父div占页面的下部分80%左右高度，撑满全部视图且自适应。

其次，在这个div里分左右布局，且不能出现全局滚动条

实现

方案一

父div设置relative，两个子div absolute，且top、bottom、left、right全部为0

方案二

方案一的缺点在于js无法获取子div的坐标。因此方案如下

父div保持方案一不变。子div设置如下

div{
    height:100px;
    min-height:100%;
    max-height:100%;
    overflow-y:scroll;
}

其中高度具体数字不重要。其中原理不明