Jquery(或 CSS)将 iframe 自动调整到底部？

Question

我不知道如何为距离顶部 300 像素但应该始终到达底部的 iframe 设置属性!

所以目前我将 iframe 的高度设置为 500px。当我调整浏览器窗口大小时，高度应该动态变化。 iframe 应从顶部开始 300 像素并始终到达底部。

我不是 CSS 专家。 知道我必须做什么吗？

    #frame {
 overflow:hidden;
 border:none;
 width:100%;
 height:500px;
 margin-top:300px;
}

Answer 1

html, body { /* Allow the #wrapper div to stretch 100% in both directions */
    height: 100%;
    width: 100%;
    margin: 0;
}
#wrapper { /* necessary because it for some reason doesn't work with the iframe */
    position: absolute;
    top: 300px;
    bottom: 0;
    left: 0;
    right: 0;
}
#frame {
    width: 100%;
    height: 100%;
    border: 0;
}

<div id="wrapper">
    <iframe id="frame" src="http://www.google.com" />
</div>