Foundation 6 Nested Modal，Z-index issue

Question

我正在尝试将十字按钮放置在图像中显示的右上角；Z索引不适用于嵌套模态。这是已使用的Z索引层， .reveal-overlay的位置：固定且Z-index值为1005，在其中。z-index为1006的.reveal和我想在所有内容的顶部使用封闭模式。 -代码-

HTML-

<div class="reveal-overlay">
   <div class="reveal">
      <div class="close-modal">
      </div>
   </div>
</div>

CSS-

.reveal-overlay {
   position: fixed;
   z-index: 1005;
}
.reveal {
   position: relation;
   z-index: 1006;
}

[如果我给位置：绝对值至闭模和z-index：1007，则它不在最前面，是否暗示为什么会这样或我在解决此问题时所犯的错误？我已经阅读了这些堆栈溢出链接以供参考-1.CSS I want a div to be on top of everything2.CSS z-index not working (position absolute)3.Putting something on top of a modal (Zurb Foundation)4. https://philipwalton.com/articles/what-no-one-told-you-about-z-index/

代码笔的链接是-https://codepen.io/IamManchanda/pen/PmaxBz

在此情况下，右上角的十字应放置在白框之外。感谢任何帮助我解决此问题的人。

Answer 1

[[https://krogerfeedback.press][1] Kroger反馈调查

[[1]：https://krogerfeedback.press ok here n。提供详细信息和共享