在隐藏溢出的div中对元素的z-index问题

Question

我有一个奇怪的问题，即使我放置一个位置：绝对值，元素的z-index也没有被设置。父元素有overflow：hidden set。

看一个我的意思的例子：

1. 转到http://www.berrisforda.com/
2. 在作业搜索选项卡上有一个自定义选择/下拉鼠标悬停在其上
3. 请注意，它被容器切断，它实际上在它下方延伸但是容器有溢出：隐藏的设置

我正在尝试设置一个z-index，但没有运气

有人可以帮忙吗？

Answer 1

在这种情况下，z-index对您无济于事。如果父元素上有overflow:hidden，则隐藏该元素边界框之外的任何子元素。您有三种选择：

1. 移动下拉元素，使其不再是overflow:hidden元素的子元素。
2. 滚动下拉列表。
3. 删除overflow:hidden样式。

Answer 2

调整.tab上的hieght缩短......

ul#output li.tab {
position: absolute;
width: 684px;
height: 345px; /*see how I changed this value*/
background-color: #fff;
}

并删除溢出：隐藏在＃feature-list {}

中

并在.dropdown dd ul {}

上设置z-index：1

执行以下步骤以修复页脚....

抱歉Burt - 我最初犯了一个错误 - 这是最后一步

从#footer

中删除位置：relative和z-index

然后你应该好好去！