前端遇到一个现代浏览器显示不一致的问题，是不是 safari 的 bug？

以下这个小 demo，在 safari 和 chrome/firefox 下表现不同。

<!DOCTYPE html>
<html lang="en">
<head>
  <style>
    html,body{
      overflow-x: hidden;
    }
    #parent1{
      position:relative;
      z-index:1
    }
    #child1{
      background-color:brown;
      position:fixed;
    }
    #parent2{
      position:fixed;
      top:0;
      left:0;
      width:100%;
      height:100%;
    }
    #child2{
      position: relative;
    }

  </style>
</head>

<body>
  <div id="parent1">
    <div id="child1">1111111</div>
  </div>
  <div id="parent2">
    <div id="child2"></div>
  </div>
</body>
</html>

部分浏览器测试结果如下：

windows 10 chrome 80.0.3987.87 （ 64 位） “111111” 内容可见
windows 10 firefox 72.0.2 (64 位) “111111” 内容可见
mac os 10.14.3 safari 12.0.3 “111111” 不可见
ios 13.3.1 safari “111111”不可见

另外在 safari 下去掉 child2 元素，111111 也可见。个人是觉得 safari 表现不正常。

这是一个专为移动设备优化的页面（即为了让你能够在 Google 搜索结果里秒开这个页面），如果你希望参与 V2EX 社区的讨论，你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/643813

V2EX 是创意工作者们的社区，是一个分享自己正在做的有趣事物、交流想法，可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.