css - CSS：防止绝对图像扩展到特定的 div

Question

有没有办法防止绝对放置的图像延伸到某些元素中？

原因：我允许我的用户通过添加图像来自定义他们的网站。但是他们可以将图像以覆盖表单按钮的方式放置 - 然后他们无法再次将其删除。

#parent{
    position:relative;
}

#my_img {
    position:absolute; 
    # top, left can be anything
}


<div id = "parent">
    <img id = "my_img" src = "my_pic.jpg" >
</div>
<div id = "other_div">
    I always want to see this text regardless of my_img top and left
</div>

Answer 1

确定您的 html 元素的布局顺序，而不是您需要定位元素（相对、绝对或固定）并为元素z-index赋值的文档结构。

您还需要为定位元素分配至少顶部/底部和左/右，以防止旧 IE 版本出现问题。

#other_div {
    position: relative;
        top: 0;
        left: 0;
    z-index: 1337;
}