title: How exactly does absolute position element behaves inside a static parent
body: <p>I ask this question because yesterday I had to style several divs as it's shown in <a href="http://jsfiddle.net/LBD5g/" rel="nofollow">this</a> JSFiddle example.</p>
  
  <p>The tricky part for me was to position <code>&lt;div id="content-container"&gt;</code> right from the <code>&lt;div id="vertical-menu"&gt;</code> but keep them top-aligned. Also I wanted the borders of <code>&lt;div id="content-container"&gt;</code> to go outside it's parent div. So after some research (I'm CSS beginner) I found out that absolute positioning may be the answer for all my questions. So indeed, as you may see I added <code>position: absolute</code> to my <code>&lt;div id="content-container"&gt;</code> and along with the other styling I got what I want.</p>
  
  <p>However from what I've read about <code>absolute</code> positioning I left with the impression that I need a parent with <code>relative</code> positioning and if such is not found I'll end up with <code>&lt;html&gt;</code> as my parent element which for me means that the element with the <code>absolute</code> positioning will be positioned at the very top-left of the page. But as the example shows, even though my parent element, nor any other element has <code>relative positioning</code> I still get my element in the flow.</p>
  
  <p>So what really happening? Why in this case my <code>absolute</code> positioned element doesn't get outside the normal flow? I think, it's correct to say that it's interacting with <code>static</code> positioned element so is there any similar behavior between <code>absolute</code> positioned elements inside <code>static</code> and <code>relative</code> parent elements. And also - could it be there some unexpected behavior - I ask this because I use this in my real world scenario and I'm satisfied with the result even when my parent is with the default <code>static</code> positioning but I wonder if this is just e lucky coincidence or just the absolute elements behave similar when they are inside either <code>static</code> or <code>relative</code> parents?</p>