占位符 z-index 在 Firefox 中存在问题

Question

3

当我使用火狐浏览器时，注册表单中的输入框上方有一个占位符，我的菜单在注册表单上方。当我将鼠标悬停在下拉菜单上方时，占位符会出现在上方。

我尝试调整z-indexes，但这似乎不是问题所在。输入字段的所有其他部分都被隐藏在下拉菜单后面，但占位符没有被隐藏。

我还尝试了向

添加z-indexes

::-webkit-input-placeholder {}
::-moz-placeholder {}
:-ms-input-placeholder {}
input:-moz-placeholder {}

但是没有用。

我希望最好不要使用Javascript来实现这一点。

enter image description here

- Mark Berry

4

请问您能否发布您的HTML和CSS代码？ - mgrsskls

请发布与问题相关的代码。最好在问题本身的代码之外，还添加一个jsFiddle示例来说明您的问题。这将有助于我们帮助您。 - Madara's Ghost

你用的是什么浏览器？在 Chrome 上看起来很好啊。 - gaynorvader

好的，看起来这只是一个Firefox的问题。 - Mark Berry

只是另一个提示：您正在使用的占位符值无效。例如，电子邮件输入的占位符值应该是类似于mail@example.com的内容。编辑：好的，您没有使用电子邮件输入，但是它的值仍然应该是用户需要填写的示例。 - mgrsskls

2个回答

-1

也许我的建议对某些人会有用... 如果您的占位元素 z-index 为0（默认值）- 设置为 #menu:

z-index: 1;

在其他情况下，#menu 的 z-index 应该比占位元素高至少1。

- IgrDi

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Neeraj · Accepted Answer

将#submenu的属性设置为position: relative即可解决问题。

除非伴随着'position'，任何z-index都是无用的。