css - 使用 overflow-x hidden 时 overflow-y visible 不起作用？

<分区>

我使用的是 overflow-x hidden，效果很好。但是您不能将 overflow-y 与它结合使用。

我错过了什么吗？

基本上是这样的……

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

与使用...完全相同

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

嗯？如果我想要滚动，我会使用 overflow-y: scroll; 但它仍然在使用它!

这是为什么？我怎样才能解决这个问题。我不能这样做... http://jsfiddle.net/xMddf/2/

因为在我的情况下，我需要 header 有 overflow-y: visible;这样我的下拉导航就可以看到了。

更新

请看我的 fiddle 。请确保取景器大于 770 像素，否则导航会切换到移动导航。

游戏的目的是让那些红色的关键线隐藏在地平线上(就像现在一样)

但是要允许下拉菜单在鼠标悬停时可见...

最佳答案

我认为您要查找的属性是 overflow-y:auto;

更新

我敢肯定，这不是您绝对首选的解决方案，但它确实有效:

这是我所做的主要内容。

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

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

不幸的是，这是 W3C 规定的浏览器行为，我相信您通过搜索该主题就知道了。唯一的解决方法是对需要隐藏的元素明智地应用溢出规则。

希望这对您有所帮助!

关于css - 使用 overflow-x hidden 时 overflow-y visible 不起作用？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24782853/

相关文章：

jquery - 使用 CSS 将 div 定位在页面底部