CSS位置：绝对但是html顺序仍然很重要

Question

我有一个网页，其中包含以下html的相应内容，以及相应的CSS：

<div class="father">
    <div class="divson"></div>
    <a class="ason"></a>
</div>

.father     {position:relative}
.father div {position:absolute}
.father a   {position:relative}

因为'divson'的位置是绝对的，所以我希望它总是相对于'父亲'（因为这个位置也是如此）。虽然，当我按照以下方式重新排序html时，'divson'仍会移动到其他地方：

<div class="father">
    <a class="ason"></a>
    <div class="divson"></div>
</div>

具有位置：绝对的div怎么可能仍然取决于html顺序？什么原因我不会想到？

由于

Answer 1

您尚未为divson设置left，top，bottom，right属性。如果使用绝对定位，则必须设置这些来修复div位置。

.divson{
 position:absolute;
 left:0;
 top:0
}

Answer 2

正如w3schools所说：

position: absolute;

元素相对于其第一个定位（非静态）祖先元素定位。

Answer 3

显示：flex 并使用商品订单（订单：1;订单：2;）