根据窗口大小和缩放调整 div 的大小

Question

我有一个div需要动态调整大小，但是当我放大网页时，我似乎无法使其工作。

<div style="background-color:red">
    Result screen small
</div>
<div style="background-color:green;height:370px;overflow:scroll">    //ignore static height
    stretch even when zoomed
</div>

http://jsfiddle.net/a6jscb6r/1/
http://jsfiddle.net/a6jscb6r/2/我想将较低的div（绿色）完全保留在浏览器窗口中，认为绿色div内的内容可以滚动

我可以动态调整它的大小，以便在我缩放时，div 会自行调整大小吗？

Answer 1

演示 - http://jsfiddle.net/victor_007/a6jscb6r/3/

将样式移到外部

使用height:calc();

* {
  margin: 0;
  padding: 0;
}
html,
body {
  height: 100%;
}
.head {
  background-color: red;
  height: 20px;
}
.cont {
  background-color: green;
  height: calc(100% - 20px);
  overflow: scroll;
}

<div class="head">Result screen small</div>
<div class="cont">stretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even
  when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch
  even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when
  zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch
  even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when
  zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomed</div>