CSS忽略overflow：hidden [英] CSS ignore overflow: hidden

问题描述

我正在为 本网站 导航，并且遇到麻烦使用下拉导航。

I'm working on the navigation for this website and am having trouble with the dropdown nav.

基本上，我将 overflow：hidden 应用于保存导航项的容器翻转效果正常工作（导航项目的底部被掩蔽）;你会看到我的意思，如果你在网站上滚动导航。

Basically, I have overflow: hidden applied to the container that holds the navigation items so that the rollover effect works properly (the bottom of the nav item is 'masked' off); you'll see what I mean if you roll over the nav on the website.

对于产品有一个下拉导航。作为内建Business Catalyst（CMS）的站点，我无法控制导航项目是如何嵌套的，但是我可以使用JQuery来显示样式/目标。

For Products there is a dropdown nav. As the site in built in Business Catalyst (CMS), I don't have control over how the navigation items are nested, but I can obviously style them / target them with JQuery.

有没有办法使下拉容器在 div＃navigation 中忽略 overflow：hidden 规则我有应用？我已经尝试将位置设置为 absolute 并使用 z-index ，但没有运气。

Is there a way to make the dropdown container within div#navigation ignore the overflow: hidden rule I have applied? I have tried setting position to absolute and playing with the z-index, but no luck.

也欢迎任何建议，以达到相同的结果。

Any suggestions to achieve the same result are also welcome.

推荐答案

overflow：hidden 不能被后代元素覆盖 - 它们将始终被元素与溢出：隐藏。

overflow: hidden can't be overridden by descendent elements - they will always be clipped by the element with overflow: hidden.

这篇关于CSS忽略overflow：hidden的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！