部分ios系统出现页面显示不完整(dom节点已经加载完整) - 工作笔记

问题描述

页面中所有dom元素已经加载完成，基本上所有的安卓手机在该页面上，dom节点所对应的页面部分是可以显示出来的。（安卓用户暂时没发现问题）
但是部分ios手机出现页面显示不完整的情况。（这里以ios9系统为例）

说一下这个页面的组成部分，大致分三个结构
顶部logo图、中间二维码、底部详情。

正常显示的页面

非正常显示的页面

后面发现这些在ios9下不能显示的部分所对应的dom元素都有一个共同的特点：
就是css样式都加了position:relative;后面把这个注释掉就可以正常显示了。（有些是position:absolute的也会显示不出来，把两个都注释了）

我一开始根本没想到这个样式会导致这个问题
一开始定位的问题是控制显示这些dom元素的变量上，后面发现dom结构都有。

总之，问题是解决了，但是具体原理我还是不太懂，猜测跟层级有关，遮盖住了该dom。在工作之余记录下这个问题，最后望有懂的C友赐教。