HTML 5 Dialog 元素重叠谷歌验证码

Question

我的验证码和 HTML5 对话框元素有问题，我的对话框与验证码图像重叠

我已将 dilogbox 的 z-index 更改为 0，但仍然重叠。我正在使用对话框 polyfill。我该如何解决这个问题？

此问题发生在 Mac Google Chrome 版本 52.0.2743.116（64 位）中

请在此处查看 jsfiddle 链接：

<div class="container">
    <dialog class="auth">
    <div id="recaptcha"></div>
    </dialog>
</div>

Answer 1

我发现了这个问题，我使用 showModal() 而不是 show() 来显示对话框。showModal() 会将对话框添加到“顶层”。z-index 属性在顶层没有影响。 HTML5 顶层