Question

我有一个IFrame可以提供安全的支付门户。我在这里模拟了这个： http://jsbin.com/biyuzuwo/1

我们一直遇到小屏幕和大字体客户无法看到IFrame底部的继续/取消按钮的问题。发生的事情是IFrame通常比页面高，页面滚动条不会影响IFrame。

现在可以看出，JSBin剪断了 - 我已经尝试使用％height来获得IFrame的最小和最大高度。这似乎或多或少在Chrome中起作用。但是在Internet Explorer / Firefox中，IFrame仍然非常小。

我是不是错了。有更好的方法吗？

.modal-body {
position:relative;    
  min-height:100%; max-height:100%;
    padding:15px;
  padding-top:0px;
    overflow-y:auto
}


#paymentIFrame{
  min-height: 70%;max-height: 70%;
}

Answer 1

您必须将高度应用于父元素，才能使其生效。

在此处查看固定代码： http://jsbin.com/biyuzuwo/35/

此外，您可以在此处阅读有关此文章的更多信息： http://alistapart.com/article/creating-intrinsic-ratios-for-video

模态IFrame高度

1 个答案: