Question

我有“容器”溢出：auto。在这个死里面我有“孩子”div与位置：亲戚。在一个子div中，我有一个“banner”div，其位置为：absolute。我想在孩子的右上角展示横幅。但是我无法看到横幅。

如果我评论“容器”div的overflow：auto语句，那么我能够看到。但是如果内容增加，我的容器div有溢出来获得滚动。请参阅以下代码。

HTML

<div class="container">
    <div class="child">
        <div class="banner">
            Banner
        </div>        
    </div>
</div>

的CSS

.container{
    max-height: 200px;
    overflow: auto;
    border: 2px solid blue;
    margin-top: 50px;
}
.child{
    position: relative;
    width: 200px;
    height: 50px;
    border: #000;
    background-color: green;
}
.banner{
    position: absolute;
    top: -20px;
    left:10px;
    height: 20px;
    width: 150px;
    border: 1px solid red;
    background-color: #ccc;
    color: #000;
    z-index: 400;
}

请参考jsfiddle http://jsfiddle.net/anu1718/XDLm5/

Answer 1

横幅广告css上的

而非左侧使用right:0px也使用top:0px; 你可以参考这个小提琴：http://jsfiddle.net/XDLm5/1/

溢出自动和位置绝对问题

1 个答案: