ios - z-index 不适用于 iPad

Question

我的#navContainer 的 z-index 在桌面上运行良好，但在 iPad 上运行不正常，有什么解决方案吗？

这是我的元素的链接 http://www.lunacarpentry.com/peachietouch/index.html

下面是我的#navContainer 的代码

width: 27%;
position: absolute;
z-index: 10;
top: 4.5em;
left: 36.55%;
padding-bottom: 14em;
-webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;

Answer 1

这可能是 iPad 的 Safari 处理 z-index 的方式。简单地解释一下，z-index 并不像大多数 Web 开发人员所认为的那样简单。

大多数 Web 开发人员从未阅读过 z-index 的文档，因为它是一个直截了当的概念，因此他们最终发现自己处于这个位置。您将能够阅读更多相关信息 here

就想要直接向前堆叠元素的解决方案而言，如果您愿意使用它，那么我建议您保持变换的堆叠顺序。您将能够专门针对 iPad 执行此操作:

-webkit-transform:translateZ(10px);