CSS:position
De MDC
Esta página está traduciéndose a partir del artículo CSS:position, razón por la cual puede haber algunos errores sintácticos o partes sin traducir. Puedes colaborar continuando con la traducción
[editar] Sumario
La propiedad position ofrece reglas alternativas para el posicionamiento de elementos, ha sido diseñada para los efectos de animación con secuencias de comandos
- Valor inicial:
static - Aplicable a: todos los elementos
- Heredable: no
- Media:
visual - Valor calculado: como se especifica
Un elemento positioned element es un elemento en el que la propiedad computed es relative, absolute, o fixed.
Un elemento absolutely positioned element es un elemento en el que la propiedad de posición computed es absolute o fixed.
Las propiedades top, right, bottom, y left especifican la posición que toma el elemento.
[editar] Sintaxis
position: static | relative | absolute | fixed | inherit
[editar] Valores
- static
- Comportamiento normal.
- relative
- Dispone todos los elementos como si el elemento no tuviera posición y luego ajusta la posición del elemento sin alterar la disposición (por tanto dejando un vacío donde sebería estar el elemento si no estuviera posicionado).
- absolute
- No deja espacio para el elemento. En su lugar, lo posiciona en unas coordenadas determinadas relativas a la posición más cercana de su elemento padre o del bloque contenedor inicial.
- fixed
- No deja espacio para el elemento. En su lugar, lo posiciona en unas coordenadas determinadas relativas a la ventana de visualización, que no se mueve al moverse la página. (O cuando se imprime, la posición es fija en cada página).
[editar] Ejemplos
[editar] Notas
Para los elementos con position relative, las propiedades top ó bottom especifican la separación vertical desde la posición normal y las propiedades left ó right especifican la separación horizontal.
Para los elementos con position absolute, las propiedades top, right, bottom, y left especifican la separación desde los bordes del elemento bloque contenedor (aquel al que el elemento es relativamente posicionado). El margen del elemento es contado a partir de ese desplazamiento.
En la mayoría de los casos, los elementos con posición absolutetienen el valor auto en las propiedades height y width para albergar el contenido del elemento. Sin embargo, los elemento posicionados absolute pueden llegar a llenar el espacio disponible especificando (en lugar de auto) tanto top como bottom y dejando height sin especificar (esto es, auto). Igualmente para left, right, y width.
Excepto para el caso anteriormente descrito de elementos posicionados absolute que llenan todo el espacio:
- Si se especifican tanto
topcomobottom(técnicamente, noauto),toptiene preferencia. - Si se especifican tanto
leftcomoright,lefttiene preferencia cuandodirectionesltr(Inglés, Japonés horizontal, Español, etc.) y tiene preferenciarightcuandodirectionesrtl(Árabe, Hebreo, etc.).