当使用overflow-x hidden时，overflow-y visible无法正常工作？

Question

我正在使用overflow-x hidden，它可以正常工作。但是你不能与之同时使用overflow-y。

所以我查看了这个链接... http://www.brunildo.org/test/Overflowxy2.html

我有什么遗漏吗？

基本上就是这样...

header {
   overflow-x: hidden;
   overflow-y: visible;
}

这与使用...

是完全相同的。

header {
   overflow-x: hidden;
   overflow-y: scroll;
}

什么？如果我想要滚动，我会使用overflow-y: scroll;，但它还是在使用！

为什么会这样？我该如何解决这个问题。我不能这样做... http://jsfiddle.net/xMddf/2/

因为在我的情况下，我需要头部具有overflow-y: visible;，以便我的下拉导航可以显示。

---

更新

请查看我的fiddle。请确保视窗大于770px，否则导航将切换到移动导航。

http://jsfiddle.net/joshmoto/42Sgu/

游戏的目标是让那些红色关键线隐藏在地平线上（就像目前一样）

但允许在悬停时显示导航下拉菜单...

- Joshc

---

最好向我们展示您导航中的实际问题，而不是一个随意的不相关的“例子”。 - Paulie_D

好的，我将在 jsfiddle 中创建我的确切情况。 - Joshc

现在请查看上面的fiddle... - Joshc

Answer 1

我认为你要找的属性是overflow-y:auto;。 更新 虽然这不是你绝对首选的解决方案，但它可以起作用：

http://jsfiddle.net/3zVc4/

这是我所做的核心内容。

#mid-row {
  overflow-x: hidden;
}
#top-row {
  overflow-x: hidden;
}

然后我从头部元素中删除了overflow-x和overflow-y规则。

不幸的是，这是W3C规定的浏览器行为，我相信你在搜索此主题时已经知道了。唯一的解决方法是谨慎地将溢出规则应用于需要隐藏的元素。

希望这可以帮到你！

- Josh Burgess

---

谢谢，但我刚试了一下，它可以滚动！http://jsfiddle.net/joshmoto/42Sgu/1/ - Joshc

如果您将fidde视口放大到750像素以上，使导航处于桌面模式，然后将鼠标悬停在下拉菜单上，您将看到标题变为滚动模式... - Joshc