滚动一个大小适合浏览器窗口的div

Question

首先，我知道有很多可滚动的div问题，但我没有看到一个似乎能解决我的问题，所以请耐心等待！

以下是我要做的事情：

• 我需要在iFrame中显示一些内容（这是我需要嵌入到我的应用程序中的报告输出）。
• 我在div中托管iFrame。
• 我想根据用户浏览器窗口的大小调整div和iFrame的大小。
• 如果iFrame中的内容大于div，我想让div滚动
• 我无法使iFrame可滚动，因为它实际上是在一个更大的UI构造中托管 - 如果iFrame有滚动条，我的“真实”应用程序中可能有两组滚动（在“现实生活中”，我不会控制Div。。

问题： 我得到了滚动条，但是一个大的报告仍然被垂直剪切 - 就好像滚动并没有真正考虑到div的完整大小。

这是我的HTML：

<div style="width:100%; height:100%; overflow: auto">
  <iFrame src="a url" style="width:100%; height:100%" scrolling="no"></iFrame>
</div>

如果我从div中删除溢出样式并使iFrame可滚动，它可以工作，但我不能在生产中这样做，因为该iFrame的主机确实需要拥有滚动条。

Answer 1

不幸的是，你拥有的代码无法运行。当您将DIV设置为100％高度时，它会查看相对于浏览器窗口的高度，以便它停在那里。它无法知道iframe中需要多少高度。

使用JavaScript可能有办法做你想做的事。检查这个问题，它可能有您正在寻找的解决方案：Adjust width height of iframe to fit with content in it