Foundation 5 CSS Z-index 顶部栏下拉菜单问题答案

【问题标题】：Foundation 5 CSS Z-index Top Bar dropdown menu issueFoundation 5 CSS Z-index 顶部栏下拉菜单问题
【发布时间】：2015-10-30 16:07:26
【问题描述】：

大家好，我需要将 z-index:2 添加到标题元素中，现在顶部栏导航下拉菜单出现在下方。我试图在许多元素上添加 {position:relative;z-index:999} ，但它不起作用。有什么提示吗？

我正在使用 CSS，添加边距以显示问题

这里的代码： [HTML 和 CSS][2]

[2]: http://codepen.io/anon/pen/yYKamg

【问题讨论】：

【解决方案1】：

改变这个：<div class="row show-for-medium-up" style="position:relative;z-index:2">

到这里：

<div class="row show-for-medium-up" style="position:relative;z-index:3">

此 div 上的 2 的 z-index: 将其放置在导航下拉列表的前面。所以我认为你需要将下拉导航的容器元素上移一个级别。

【讨论】：

我当然知道这一点，正如我之前提到的，我需要在标题元素中添加“z-index:2”，以便在后台使用 z-index:1 来处理其他元素。我想将下拉列表向前推 z-index:999 左右
尝试通读：smashingmagazine.com/2009/09/… 同时检查 Firefox 中的元素并打开 3D 视图，以便查看元素的堆叠方式。我想说您可能需要将position: relative 和z-index 应用于更多元素。
是的，我知道它是 z-index，我试图通过正确的元素，但我做不到。我发布了我终于得到的正确答案。父容器必须自己编辑。
是的，对不起@Yasser 我误读了你原来的问题，现在更新了我的答案，虽然我看到你现在也找到了正确的解决方案。

【解决方案2】：

<div class="row show-for-medium-up" style="position:relative;z-index:99">

这修复了它，将父容器设置为更高的 z-index。我很确定我昨天不止一次尝试过这个。多谢你们。如果有任何消息，我会及时通知您。

【讨论】：