Caixa 2

P. Relativo

#caixa2 {
background-color: #CCC;
margin: 20px;
padding: 10px;
height: 300px;
width: 300px;
position: relative;
left: 300px;
}

Caixa 3

P. Relativo

#caixa3 {

background-color: #999;
margin: 0px;
padding: 10px;
height: 300px;
width: 350px;
position: relative;
left: 500px;
}

Caixa 4

P.Fixo

#caixa4 {

background-color: #666;
margin: 0px;
padding: 10px;
height: 400px;
width: 250px;
position: fixed;
left: 0;
top: 50px;
}

A DIV dois tem um posicionamento relativo e um posicionamento à esquerda de 300px. A DIV três foi deslocada para a esquerda 550px, também com um posicionamento relativo.

A DIV quatro tem um posicionamento fixo: 50px no topo, 0px à esquerda.

É uma boa prática atribuir um posicionamento relativo à DIV que contém outras DIVs com posicionamento relativo. Neste exemplo a DIV um tem posicionamento relativo.