iberck
11/17/2015 - 1:41 PM

CSS Position

CSS Position

Position

position: static: La posición “static” es el valor predefinido por defecto de todos los elementos HTML. Los elementos posicionados estáticamente se van colocando uno a continuación de otro, según el flujo HTML.

position: absolute: Las capas que tienen una posición absoluta no forman parte del flujo natural de los otros elementos del documento HTML, sino que su posición está asignada independientemente de la posición de los otros elementos.

La posición de las capas con “position:absolute” se fija mediante unas coordenadas, que vienen dadas por los atributos left(x) top(y). El punto inicial de estas coordenadas es la esquina superior izquierda de la caja que contiene los elementos. Ejemplo position: absolute

position: relative: Anteriormente hemos visto cómo los elementos con posición absoluta no formaban parte del flujo HTML. Pues a diferencia de éstos, los elementos con posición relativa sí forman parte de este fluir.

Para elementos con un posicionamiento relativo, el origen de sus coordenadas no es la esquina superior izquierda del elemento contenedor, sino la posición que ocuparían naturalmente. Se fija mediante unas coordenadas, que vienen dadas por los atributos left(x) top(y). Ejemplo position: relative