0

我想知道当容器相对定位并且溢出设置为隐藏时，是否完全不可能释放嵌套的 div？

在这种情况下，给嵌套的 div 一个固定的位置并不是一种选择。

请看一下这个例子：http: //jsfiddle.net/s7nhw/11/。

任何人都知道如何做到这一点？

我会很感激任何反馈！

<div class="container">
    <div class="nested-div"></div>
</div>

<style>
.container {
    margin: 0 auto;
    width: 100px;
    height: 100px;
    background: green;

    overflow: hidden;
    position: relative;
}
.nested-div {
    width: 200px;
    height: 100px;
    background: red;
    z-index: -1;

    position: absolute;
}
</style>
4

2 回答 2

1

我从未遇到过可以覆盖 {overflow: hidden} 的情况。您可能需要重新构建 HTML 以将嵌套的 div 放置在代码中其父级之外，然后使用绝对定位和 z-index 将其定位在当前包装器的后面。

http://jsfiddle.net/s7nhw/13

.container {
    width: 100px;
    height: 100px;
    background: green;
    overflow: hidden;
    position:absolute;
    left: 50%;
    margin-left: -50px;
}
.nested-div {
    width: 200px;
    height: 100px;
    background: red;
    z-index: -1;
    margin: 0 auto;
    position: absolute;
    left: 50%;
    margin-left: -100px;
}

<div class="nested-div"></div>
<div class="container"></div>

这里有一些进一步的讨论：覆盖溢出：用 z-index 隐藏

于 2013-01-22T13:38:36.237 回答
0

绝对位置子元素始终保持在相对位置父元素之下

于 2013-01-22T13:41:52.410 回答