修复iPad底部的iframe内的div

我有一个固定div的页面显示在屏幕的底部。 当我将该页面放入iframe时,在桌面查看时没有任何问题

在桌面上,黄色栏位于底部,没有任何问题: https : //jsfiddle.net/x1p4bf7j/12/

 

但在iPad上,文本并不适合iframe。 以下是它在iPad中的显示方式 在此处输入图像描述

正如您在图像中看到的那样,没有粘性页脚。 我希望它能在我的iPad底部。

在此处输入图像描述

问题是移动safari如何呈现iframe。 它不尊重高度属性,更喜欢根据内容的高度设置iframe的高度。 就个人而言,当您考虑早期版本的IOS如何处理溢出滚动(两个手指滚动)时,这是有意义的 – 想象一下iframe还包含一个可滚动元素!

(这里有一个相关的stackoverflow: 在iOS上使用CSS的iframe大小 )

无论如何,你的“固定”页脚是固定的 – 就在一个非常大的iframe的底部。