iOS Safari和Chrome上的Z-index问题

我在基于wordpress Underscores主题的响应式下拉菜单中遇到了问题。

它在桌面上看起来不错，但在iOS Safari（包括iPad和iPhone）上却没有。

我也尝试将z-index添加到其他div中，但它不起作用。 请帮帮我。 谢谢。

Answer 1

实际上有第四种方法，有translate3d：

-webkit-transform: translate3d(0,0,1px); transform: translate3d(0,0,1px); 

iOS浏览器完全支持CSS3，因此您可以安全地使用它。

Answer 2

有三种方法可以解决这个问题：
1.您可以将z-index值设置为80或90之类的大数字。
2.您可以在其他div之后添加菜单元素（因此默认情况下它会放在其他项目上）
3.您可以将div中文本的z-index设置为小于菜单div的z-index。

Answer 3

您不能只将z-index应用于下拉菜单 – 您需要做的是将z-indicies应用于兄弟元素以确保正确的堆叠顺序。

如果没有看到您的HTML，就无法确定它们应该去哪里。 但我能说的最好的是将z-index应用于整个导航栏，将一个z-index应用于整个内容div。 请记住，正如Ajay所说，为了使z-indicies正常工作，它们所应用的元素必须非静态定位（在你的情况下：相对很可能是最佳选择）。

Answer 4

如果下拉菜单的父元素是nav，则应将z-index设为大数，高于其他元素