iOS 下 iframe 撑开父容器高度 bug

[shiiiiiiji]

最近在调试一个非常诡异的 bug ，在 PC 和安卓下都是正常的，但是发现在 iOS 却出现问题。代码如下：

• HTML

<div class="wrapper">
	<iframe src="https://www.cnblogs.com/DSC1991/p/8665891.html"></iframe>
</div>

• CSS

.wrapper{
  width: 100%;
  height: 200px;
  
}

.wrapper iframe{

}

发现iframe竟然不受父容器的高度限制，撑开了父容器，导致滑动UI显示异常。

在父容器应用下面CSS便显示正常：

-webkit-overflow-scrolling: touch;
overflow-y: scroll;

参考

• https://davidwalsh.name/scroll-iframes-ios