This is an example as to how the positioning works!

Scenario 1 shows the normal layout without any positioning of the div's div id=sandwich has 3 div's inside of it div-1, div-2, div-3

scenario 1
This is the top div
sandwiched div
Div 1!
Div 2!
Div 3!
This is the bottom div

This scenario shows that nothing happens if position:static is applied, because position:static is the default positioning. In it, elements appear how they would in the normal flow

scenario 2
This is the top div
sandwiched div
Div 1! with position:static applied
Div 2!
Div 3!
This is the bottom div

Scenario 3 below, shows what happens if position:relative is applied, If position:relative is applied to an element, it is laid out as per the normal flow and then taken out and positioned relative to its position in the normal flow.

scenario 3
This is the top div
sandwiched div
Div 1! with position:static applied
Div 2! with position:relative applied Note the space of this div is still occupied by this div..
Div 3!
This is the bottom div

scenario 4 explains what happens if position:absolute is applied. The element is removed from the normal flow and positioned absolutely as specified.

scenario 4
This is the top div
sandwiched div
Div 1! with position:static applied
Div 2! with position:relative applied Note the space of this div is still occupied by this div..
Div 3! with position:absolute applied
This is the bottom div

It's very interesting if an element can be positioned relative to a container! Scenario 5 is just that, position:relative is applied to the container div and position:absolute is applied to the elements

scenario 5
This is the top div
sandwiched div
Div 1! with position:static applied
Div 2! with position:relative applied Note the space of this div is still occupied by this div..
Div 3! is now relatively positioned w.r.t the container!
This is the bottom div