Question

我在其他一些div中有几个div，我希望我的页面高度保持不变，所以我想使用overflow-y：在我的div中滚动，所以主包装总是80％的总高度。正如你可以看到here，它只是使页面更大，它不会添加滚动的东西（即使它被渲染，它也不可用）。

#messages_messageUIWrapper {
    width: 90%;
    margin: auto;
    display: block;
    background-color: gray;
    height: 80%;
    max-height: 80%;
    overflow: hidden;
}
#messages_contentWrapper {
    display: block;
    background-color: gray;
    float: left;
    width: calc(100% - 260px);
    height: 100%;
    max-height: 100%;
    overflow-y: scroll;
}
#messages_peoplePicker {
    background-color: gray;
    display: block;
    float: left;
    width: 260px;
    overflow-y: scroll;
}

我该如何解决？

提前谢谢

Answer 1

请尝试以下操作： Demo

CSS：

html, body { 
    height:100%;
}

#messages_peoplePicker {
    background-color: yellow;
    display: block;
    float: left;
    width: 260px;
    height: 100%;
    max-height: 100%;
    overflow-y:scroll;
}

修改：如果您想要全高，可以这样使用： Demo

CSS：

html, body { 
height:100%;
overflow: hidden;
} 

#messages_messageUIWrapper {
    width: 90%;
    margin: auto;
    display: block;
    background-color: gray;
    overflow: hidden;
    position:absolute; top: 0px; left:0px; right:0px; bottom:0px
}

overscroll：即使设置了最大高度和高度，auto也无法工作

1 个答案: