html - iOS css位置错误（位置：相对不适用于移动设备）

Question

我有一个div需要position: relative为了div垂直居中。它在计算机浏览器上运行良好，但在某些 iOS 设备上似乎position: relative没有被应用。因此，div在顶部被切断了 50%，因为它具有样式：transform: translateY(-50%).

以下是我的代码的简化版本：

<div id="parent" style="position: relative">
    <div id="child" style="position: relative; top:50%; transform: translateY(-50%);">
        <p>Some content</p>
    </div>
<div>

我的代码是如何设置的，是否有一些问题导致它不能专门在某些 iOS 设备上运行（适用于 iPhone 8 但不适用于 6）？

标签： htmlioscsscross-browser