title: Absolute positioning inside absolute position
body: <p>I have 3 <code>div</code> elements.</p>
  
  <p>1st <code>div</code> is bigger (wrap) and has <code>position:relative;</code></p>
  
  <p>2nd <code>div</code> is positioned absolute to the 1st <code>div</code> relative positioning (and is included in the 1st <code>div</code>)</p>
  
  <p>3rd <code>div</code> is contained in the 2nd <code>div</code> and also has absolute positioning.</p>
  
  <pre><code>&lt;div id="1st"&gt;
     &lt;div id="2nd"&gt;
       &lt;div id="3rd"&gt;&lt;/div&gt;
     &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Why is the 3rd <code>div</code> position absolute to the 2nd <code>div</code> (which is also absolute position to the 1st <code>div</code>) and not to 1st <code>div</code> that has relative position ?</p>
  
  <p>Because the 3rd <code>div</code> is absolute positioning to the absolute positioned 2nd <code>div</code>.</p>