我有3个div元素。
第div一个更大（包装）并具有position:relative;
第2个相div对于第1个div相对位置绝对定位（并包含在第1个中div）
第3个div包含在第2个中，div并且也具有绝对定位。
<div id="1st">
<div id="2nd">
<div id="3rd"></div>
</div>
</div>
为什么第3个div位置相对于第2个div绝对位置（这也是第1个位置的绝对位置div）而不是div相对位置的第一个位置？
因为3rddiv是绝对定位到2nd绝对定位div。
Answers:
因为position: absolute就像重置孩子的相对位置position: relative一样。
这是无法解决的-如果您希望第三个div相对于第一个绝对定位，则必须使其成为第一个的子代。
0px / 0pxposition: absolute
position:relative表示该元素将相对于其当前位置进行定位（使用顶部，右侧，底部左方）。position: absolute表示它将相对于浏览器窗口或第一个父项使用position: absolute或定位position: relative。
二者position:relative并position:absolute建立包含元素作为定位ascestors。
如果需要基于div 1定位div 3，则使其成为div 1的直接子代。
注意，这position: relative意味着该元素相对于其自然位置定位，并且position: absolute意味着该元素相对于其第一个position:relative或position:absolute祖先位置。
静态位置：如果完全没有指定位置，则静态位置是元素在HTML文件的常规流程中显示的默认方式。
重要提示：top，right，bottom和left性能没有影响静态定位的元素。
相对位置：使用相对值定位元素可将元素（及其占据的空间）保持在HTML文件的常规流程中。
然后，您可以通过一定量使用属性移动元素left，right，top和bottom。但是，这可能导致该元素与页面上的其他元素重叠-这可能是或可能不是您想要的效果。
相对定位的元素可以从其位置移开，但仍占据其空间。
绝对位置：将绝对位置值应用于元素会将其从法线流中移除。当您移动绝对定位的元素时，其参考点是其最近包含的元素的顶部/左侧，该元素的位置声明为非静态（也称为其最近的定位上下文）。因此，如果不存在除静态以外的其他包含元素，则它将从主体元素的左上角开始定位。
在您的情况下，第3个最近的容纳容器是第2个。
另一个明确的答案。
您当前的情况是这样的：
#my-parent {position: absolute}
#my-parent .my_child {position: absolute}
而且您正在为此苦苦挣扎。
如果可以更改HTML，只需执行以下操作：
#my-parent {position: absolute}
#my-parent .my-wrapper {position: relative} /* Since you've added the wrapper in HTML */
#my-parent .my-wrapper .my-child {position: absolute} /* Now you can play with it */
为什么第三个原因div元素绝对定位的第二个div元素是因为CSS规范解释这里，是因为“父”元素（还好说：包含块）的的绝对定位的元素并不一定是其直接的父元素，但而是其直接定位的元素，即位置设置为除static例如以外的任何元素的元素position: relative/absolute/fixed/sticky;
因此，只要代码中有可能，如果您希望第3个div元素相对于第1个元素绝对定位，div则应将第2个div元素作为position: static;其默认值（或者只是删除position: ...第2个div元素的规则集中的任何声明） 。
上述将使第一div的包含块的第三的绝对定位div，忽略第二div对于这种定位的目的。
希望能帮助到你。