简体繁体 English

position：relative，overflow：隐藏父级和绝对子级

[英]position: relative, overflow: hidden parent and absolute child

原文 2012-07-03 21:00:11 0 1 html/ css/ position/ overflow/ drop-down-menu

Okay, here's an example: http://jsfiddle.net/jGLvk/405/ 好的，这是一个例子： http ： //jsfiddle.net/jGLvk/405/

If you hover the 9012 menu, you will have sliced dropped down submenu that is absolute. 如果您将9012菜单悬停，则会有切片下拉的子菜单，这是绝对的。 Remove position:absolute, or overflow:hidden from any of its parents: you will have normal working dropdown menu. 删除位置：绝对或溢出：隐藏任何父母：你将有正常的工作下拉菜单。

“Overflow-y:visible” will just generate a scrollbar instead of showing menu. “溢出-y：可见”只会生成滚动条而不是显示菜单。

Please help me! 请帮我！ I need a regular superfish dropdown menu in such tricky ancestors. 我需要在这些棘手的祖先中使用常规的超级鱼类下拉菜单。

Thank you! 谢谢！

1 个解决方案

Here, take a look. 在这里，看一看。 I'm not sure what the overflow:hidden is for, but would it work applied to the div ul and not the div ? 我不确定overflow:hidden是什么，但它是否适用于div ul而不是div ？ If so, well do it, and set the position: relative on the div. 如果是这样，那就做好，并在div上设置position: relative 。 Take a look -> http://jsfiddle.net/jGLvk/407/ 看看 - > http://jsfiddle.net/jGLvk/407/

Since the absolutely positioned elements becomes relative to the div , it ignores the overflow:hidden; 由于绝对定位的元素变得相对于div ，它忽略了overflow:hidden; set on the ul . 设置在ul 。