关于div height 100%的问题

Question

一个页面中如果一个div的元素上方还有元素，设置这个div的高度100% overflow：scroll-y；为什么滚动的时候看不全div中的元素，需要用js动态设置高度嘛？

Answer 1

你可能写了这样的样式

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

如果是这样，那你所说的看不全的部分的高度，就是你上方元素的高度。

实现这样布局的方式不唯一：

• 你可以使用过 flex 布局，教程参考这里
• 你可以使用定位，上方元素做吸顶，同时给你这个div设置padding-top为上方元素的高度，同时设置box-sizing: border-box
• 你也可以保持现状，下方的这个div的高度设置为height: calc(100% - 上方元素的高度)，注意括号内的空格