iOS Safari Z-index 不工作

Question

我有一个 HTML 格式的下拉菜单，但它被 iOS 上的其他一些页面内容 隐藏 了。下拉列表在 Android 和 PC 上完美显示，但拒绝出现在 iOS Safari 浏览器上（已在 iOS 9 和 10 上测试）。

我为下拉列表指定了较高的 z-index，为页面内容指定了较低的 z-index。我也试过：

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

没有运气。

这是我的 CSS：

落下

.dropdown-content2 {
    display: none;
    position: fixed;
    left: 10%;
    background-color: #EFEFEF;
    padding: 20px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 99;
    font-size: 13px;
    width: 50%;
    height: 300px;
    overflow-y: auto;
    -webkit-transform: translate3d(0,0,1px);
    transform: translate3d(0,0,1px);
}

页面内容

.newmain{
  margin-left:0px;
  margin-top: 130px;
  padding: 20px;
  z-index: 90;
}

原文由 grape657 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

这不是 Z-index 问题。结果下拉菜单的父元素设置为 overflow: hidden 。将它设置为 Overflow: visible 解决了它。谢谢。

原文由 grape657 发布，翻译遵循 CC BY-SA 4.0 许可协议