Bootstrap: 下拉菜单中的 Z-Index 问题

创建于 2016-03-11  ·  3评论  ·  资料来源: twbs/bootstrap

按钮下拉菜单(可能是其他组件)上的重叠元素和 z-index 似乎存在问题。 我创建了一个 JS Fiddle 来重现。 https://jsfiddle.net/qu1ewxau/

请注意,底部的输入组覆盖了上部的下拉菜单。

提示:点击汉堡。

最有用的评论

我找到了解决方法。 看来,如果我完全删除 .btn-group 父级,并仅依赖 .input-group (并将所有跨度更改为 div 以使愚蠢的机器人开心),z-index 将应用于 .btn而不是 .btn 组,生活是美好的。

更新示例: https ://jsfiddle.net/qu1ewxau/2/

所有3条评论

嗨@devdelimited!

您似乎发布了一个实时示例(https://fiddle.jshell.net/qu1ewxau/show/light/),这始终是一个很好的第一步。 但是,根据HTML5 验证器您的示例有一些验证错误,这可能会导致您的问题:

  • 第 92 行,第 17 列到第 39 列:在此上下文中,元素div不允许作为元素span的子元素。 (抑制来自该子树的更多错误。)
  • 第 122 行,第 17 列到第 39 列:在此上下文中,元素div不允许作为元素span的子元素。 (抑制来自该子树的更多错误。)
  • 第 83 行,第 13 列到第 36 列: label元素的for属性必须引用非隐藏表单控件。
  • 第 113 行,第 13 列到第 36 列: label元素的for属性必须引用非隐藏表单控件。

您需要修复这些错误并发布修改后的示例,然后我们才能继续进行。
谢谢!

(_请注意,这是一个完全自动化的评论。_)

我找到了解决方法。 看来,如果我完全删除 .btn-group 父级,并仅依赖 .input-group (并将所有跨度更改为 div 以使愚蠢的机器人开心),z-index 将应用于 .btn而不是 .btn 组,生活是美好的。

更新示例: https ://jsfiddle.net/qu1ewxau/2/

嗨@devdelimited!

您似乎发布了一个实时示例(https://fiddle.jshell.net/qu1ewxau/2/show/light/),这始终是一个很好的第一步。 但是,根据HTML5 验证器您的示例有一些验证错误,这可能会导致您的问题:

  • 第 83 行,第 15 列到第 40 列: label元素的for属性必须引用非隐藏表单控件。
  • 第 111 行,第 15 列到第 40 列: label元素的for属性必须引用非隐藏表单控件。

您需要修复这些错误并发布修改后的示例,然后我们才能继续进行。
谢谢!

(_请注意,这是一个完全自动化的评论。_)

此页面是否有帮助?
0 / 5 - 0 等级

相关问题

andyyou picture andyyou  ·  3评论

iklementiev picture iklementiev  ·  3评论

bellwood picture bellwood  ·  3评论

ghost picture ghost  ·  3评论

matsava picture matsava  ·  3评论