La propiedad positión puede tomar varios valores distintos:
1.- position:static. No afecta a su posisión pero es un elemento con un valor de position
2.- position:relative. El posicionamiento relativo desplaza una caja respecto de su posición original establecida mediante el posicionamiento normal. El desplazamiento de la caja se controla con las propiedades top, right, bottom y left.El valor de la propiedad top se interpreta como el desplazamiento entre el borde superior de la caja en su posición final y el borde superior de la misma caja en su posición original.
Una caja con posicionamiento relativo puede superponerse a otras. En esta págia el segundo div tiene posicionamiento
relativo, la propiedad top: 70px y la propiedad left: 50px. Se moverá respecto de su posición normal 70 pixels para
abajo y 20 a la derecha.
El cuarto div tiene un posicionamiento relativo y la propiedad left:-40.
3.- position:fixed. Un elemento fixed (fijo) se posiciona a la ventana del navegador de manera fija,
lo que significa que se mantendrá en el mismo lugar incluso después de hacer scroll en la página. Al igual que
con relative, las propiedades top, right, bottom, y left también son usadas y determinan la posición en la que
se coloca el elemento posicionado como fixed.
El menú de la derecha tiene este posicionamiento, con top:40px; left:0px;.
El octavo div esta posicionado fixed, pero a 0px de la parte de abajo de la ventana del navegador
y a 0px del lado derecho de la ventana.
4.- position:absolute. Se comporta como fixed pero es relativo a su ancestro (elemento contenedor superior)
posicionado más cercano en lugar de ser relativo a la ventana del navegador. Si un elemento con position: absolute;
no tiene ancestros posicionados, usará el elemento body del documento, y se seguirá moviendo al hacer scroll en la
página. Recuerda, un elemento "posicionado" es aquel cuyo valor es cualquiera excepto static.
Un elemento absolute sobrevuela sobre los otros elementos