具有绝对定位的CSS溢出

Question

我正在尝试向jQueryUI可拖动和可调整大小的元素添加溢出滚动。由于jQuery UI中的bug，所有可调整大小的元素在默认情况下都是绝对定位的，溢出不起作用。

HTML

<div class="container">
   <div class="object" style="top:10px;"></div>
   <div class="object" style="top:20px;"></div>
   <div class="object" style="top:30px;"></div>
   <div class="object" style="top:40px;"></div>
   <div class="object" style="top:50px;"></div>
</div>

CSS

.container{
    width: 100%;
    height: 40px;
    background-color:#000000;
    top:0px;
    overflow:scroll;
}
.object{
    position:absolute;
    height:5px;
    background-color: #AAAAAA;
    left:100px;
    width:50px;
}

是否可以将溢出滚动添加到具有绝对定位div的容器？

jsfiddle

Answer 1

是的，你可以在父容器上使用position: relative;

Demo

Demo 2

.container{
    width: 100%;
    height: 40px;
    background-color:#000000;
    top:0px;
    overflow:scroll;
    position: relative;
}