Question

http://jsfiddle.net/waitinforatrain/sEX3n/

我在一个绝对位置的容器中有两个div。它们都设置在容器的边界之外。如果我取消注释overflow：hidden行，它将隐藏容器外的所有内容。

但是，我只想隐藏div1的溢出，并且div2是可见的。但是因为必须在父级中设置overflow：hidden，它将隐藏它们。有没有办法隐藏一个？

即使我能得到它，以便它在顶部和底部边界显示溢出但不在左边和右边显示适合（我试图弄乱overflow-x和overflow-y但是我认为这不是他们的预期目的）。

<div id="container"> 
    <div id="div1"></div> 
    <div id="div2">Test</div> 
</div> 

#container {
    width: 300px;
    position: relative;
    border: 1px solid #000;
    height: 10px;
    /*overflow: hidden;*/
}

#div2 {
    position: absolute;
    top: 16px;
    border: 1px solid #444;
}

#div1 {
    position: absolute;
    height: 10px;
    left: 90%;
    width: 15%;
    background-color: purple;
}

Answer 1

最明显的解决方案是：

添加额外的包装div。
将overflow: hidden应用于此div。
将时间移到此div。

像这样：http://jsfiddle.net/sEX3n/4/

Answer 2

为什么不将div#time移到div#video-seek之外？

像这样：http://jsfiddle.net/moeishaa/XNAmn/

设置溢出：仅对某些元素隐藏

2 个答案: