CSS位置：相对vs位置：绝对
我试图弄清楚如何清除或重置页面上元素的相对位置。我有一个元素，它的位置是：relative，在树的下一点定义了一个对话框div，还有一个背景图像，它被拉伸以填充页面，使对话框成为模态 问题是b/c有一个位置：在DOM树的更上层，当我对背景图像说CSS位置：相对vs位置：绝对,css,css-position,Css,Css Position,我试图弄清楚如何清除或重置页面上元素的相对位置。我有一个元素，它的位置是：relative，在树的下一点定义了一个对话框div，还有一个背景图像，它被拉伸以填充页面，使对话框成为模态 问题是b/c有一个位置：在DOM树的更上层，当我对背景图像说top:0，left:0时，它指向该元素的0,0相对，而不是页面的0,0 如何清除或重置相对定位，以便将绝对定位的背景图像设置为页面的0,0？我们希望先查看您的代码，但您可能正在关注此问题： position: absolute !important;
top:0left:00,0如何清除或重置相对定位，以便将绝对定位的背景图像设置为页面的
0,0position: absolute !important;
在大多数情况下，你的模态应该是身体的直接子对象 如果模态有一个具有相对或绝对位置的祖先，那么您不能“撤消”这一点，除非更改有问题元素上的样式 HTML:
设置为（0,0）的绝对定位元素将始终到达其最近的父元素（位置相对）的（0,0）角。这是已定义的行为，不能更改 由于您完全定位了模态，我建议您从相对定位的元素中拉出，然后将其粘贴在（a）未定位的父项下，或者（b）正好在body标记之后
编辑：约翰纳森打败了我 如果我不能让模态成为body的直接子对象（由于母版页/用户控件等），那么实现我需要的唯一方法就是使用javascript从DOM中删除模态，然后将其附加到body中？或者还有其他方法吗？使用JS将模态移动到主体是一个非常合理的解决方案，是的。从DOM中删除模态并将其附加回主体非常有效。谢谢
<html>
<head>...</head>
<body>
<div id="content">content!</div>
<div id="someModal" class="modal" style="display:none"></div>
</body>
</html>
.modal {
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
}