将一些东西放在模态上（Zurb Foundation）答案

【问题标题】：Putting something on top of a modal (Zurb Foundation)将一些东西放在模态上（Zurb Foundation）
【发布时间】：2017-12-17 17:02:21
【问题描述】：

我希望一个 div 出现在 Zurb Foundation 显示模式的顶部。

但是，我的 div 拒绝显示在模式顶部。

模态框的 z-index 为 1006。当我将顶部 div 设置为 1010 甚至 99999 时，它仍然位于模态框下方。

我可以让它工作的唯一方法是将基础模态的.reveal-overlay 的 z-index 设置为 0（即使 1 将它放在我的 div 顶部），但这会弄乱其他元素。

如何将元素放在 Zurb Foundation 模态之上？

【问题讨论】：

如果没有重现问题的minimal reproducible example，任何人都很难提供帮助

标签： javascript html css modal-dialog zurb-foundation

【解决方案1】：

你的div 需要在 dom 的顶层才能工作。

以下将起作用。

<div class="reveal">
<h1>my reveal</h1>
</div>

<div style="z-index: 1100; width:500px; height: 500px; 
top: 100px; position: absolute;left: 200px;">On top of the reveal</div>

</body>
</html>

【讨论】：