css - 重叠Div定位

我想在图像上放置横幅。图像和横幅（横幅片段）都在同一父元素中，因此黑色横幅被推开了视线。我怎样才能解决这个问题。

您可以在这里查看我的来源：

<div id="slide-banner">
    <img src="http://upload.wikimedia.org/wikipedia/commons/0/0c/GoldenGateBridge-001.jpg"/>
    <div id="slide-banner-snippet">
    </div>
</div>​

#slide-banner {
    margin-top: 70px;
    margin-right: auto;
    margin-left: auto;
    padding: 0px 0px 0px 0px;
    height: 350px;
    width: 916px;
    border: 1px solid #ccc;
    border-radius: 3px 3px 3px 3px;
    overflow: hidden;
}

#slide-banner img {
    height: auto;
    width: 916px;
}

#slide-banner-snippet {
    height: 55px;
    width: 916px;
    background-color: #000;
}

http://jsfiddle.net/uSw8S/

最佳答案

绝对定位要浮动的元素，即：

position:absolute;
top:0;
z-index:1;

关于css - 重叠Div定位，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/11605672/