图像走出去的容器

Question

我有一个图像，我想重叠的横幅，但我有一个问题，当我重新调整窗口的图像不会随着它移动。我提供了一个截图和我的CSS。

CSS：

.coslogo { 
    display: block; 
    margin: -150px auto 0; 
    top: 150%; 
    /*padding: 20px;*/ 
    width: 100%; 
    left: 50%; 
    margin-left: 590px; 
    z-index: 9; 
} 

.coslogo img { 
    overflow: auto; 
} 

Answer 1

看起来你有你的位置设置为绝对的，因为你是如何定位的重叠旗帜。您需要将position:relative;添加到.coslogo的css中。没有html，我不能更具体，所以包括，如果这没有帮助！

Answer 2

您可以使用css relative和absolute与z-index进行定位，以将图像放在另一个上。

.main { 
 
    border: 1px solid #000; 
 
    position: relative; 
 
} 
 

 
.img1 { 
 
    border: 1px solid #f00; 
 
    position: relative; 
 
    z-index: 2; 
 
} 
 

 
.img2 { 
 
    border: 1px solid #0f0; 
 
    position: absolute; 
 
    z-index: 2; 
 
    top: 0px; 
 
    left: 0px; 
 
}

<div class="main"> 
 
    <img class="img1" src="http://t0.gstatic.com/images?q=tbn:ANd9GcTG4mTuuZmylqn_qqviXFh5EPLD_DTsXMIjXT-4XJM0QPtJxw7lXw&t=1" /> 
 
    <img class="img2" src="http://t0.gstatic.com/images?q=tbn:ANd9GcTG4mTuuZmylqn_qqviXFh5EPLD_DTsXMIjXT-4XJM0QPtJxw7lXw&t=1" /> 
 
</div>