使用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/

因为在我的情况下，我需要标题溢出y：可见;所以我的下拉导航可见。

---

更新

请看我的小提琴。请确保取景器大于770px，导航切换到移动导航。

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

游戏的目的是让那些RED keyline隐藏在地平线上（就像现在一样）

但允许导航下拉在悬停时可见...

Answer 1

我认为您正在寻找的属性是overflow-y:auto;

<强>更新

这不是你绝对偏爱的解决方案，我敢肯定，但这很有效：

http://jsfiddle.net/3zVc4/

这就是我所做的事情。

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

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

不幸的是，这是W3C规定的浏览器行为，因为我相信你会从搜索这个主题中知道。唯一的解决方法是明智地将溢出规则应用于需要隐藏的元素。

希望这有帮助！