CSS position:absolute but html order still matters : <p>I have a web page with an equivalent of the following html, and the corresponding CSS:</p>

<pre><code>&lt;div class="father"&gt;
    &lt;div class="divson"&gt;&lt;/div&gt;
    &lt;a class="ason"&gt;&lt;/a&gt;
&lt;/div&gt;

.father     {position:relative}
.father div {position:absolute}
.father a   {position:relative}
</code></pre>

<p>Because 'divson' has position:absolute, I'd expect it to be always placed relatively to 'father' (because this one is positioned as well). Although, 'divson' still moves elsewhere when I reorder the html as follows:</p>

<pre><code>&lt;div class="father"&gt;
    &lt;a class="ason"&gt;&lt;/a&gt;
    &lt;div class="divson"&gt;&lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>How is it possible that a div with position:absolute still depends on the html order? What could be a cause that I wouldn't have thought of?</p>

<p>Thanks</p>
