DIV - 强制高度100%=/=页面高度？

Question

我正在尝试设置一个设计,这是一个很大的问题.这是一个参考网站;

问题是我将身体设置为高度:100%; 在样式表和#wrapper div中也是如此.高度偏离当前页面高度,并没有考虑到其他div可能导致溢出.

我想,即使浏览器的垂直大小发生变化,空白页面也是浏览器的大小,内容/包装器div将缩小以适应.

可以这样做吗？

编辑

好的,我原来的问题非常混乱.这是一张照片;

所以,在图1(左)是问题.高度100%; 在包装器和内容div上,它正在创造那个坏孩子.我希望它看起来像图片,白色/灰色区域根据浏览器的大小增长/缩小...

Answer 1

最简单的方法就是使用CSS:

height: 100vh;

其中'vh'代表浏览器窗口的垂直高度.响应调整浏览器和移动设备的大小.

Answer 2

给身体,HTML和主DIV height 100%.像这样写:

body,html{height:100%;}

.parent{
    min-height:100%;
    width:400px;
    margin:0 auto;
    background:red;
}

Answer 3

添加overflow:auto到wrapper元素。