Posicionamiento

Search…

Posicionamiento

La propiedad CSS position define el tipo de posicionamiento para el elemento. Los posibles valores son:
static: el valor por defecto.
relative: relativo a su ubicación normal.
fixed: fijo en la ventana del navegador.
absolute: relativa el ancestro más cercano con posición relative o a la ventana del navegador.
Los valores relative, fixed y absolute se utilizan generalmente en conjunto con las propiedades top, left, bottom y right.
position: relative
Nos permite mover el elemento a una ubicación relativa a su posición original utilizando las propiedades: left, top, right, bottom.
p {
  position: relative:
  top: 20px;
  left: 20px;
}
En lo posible se recomienda mejor utilizar margin.
position: relative se utiliza más para posicionar elementos de forma absoluta dentro del elemento.
position: absolute
Nos permite ubicar un elemento a una ubicación relativa al ancestro más cercano que esté posicionado con position: relative, o a la ventana del navegador en su defecto.
Se utilizan las propiedades top, left, right y bottom para ubicar el elemento.
p {
  position: absolute:
  left: 100px;
  top: 100px;
}
position: fixed
Esta propiedad nos permite ubicar un elemento de manera fija relativamente a la ventana del navegador. No importa si se utilizan las barras de desplazamiento, el elemento va a permanecer fijo en su posición.
div.fixed {
  position: fixed;
  bottom: 0;
  right: 20px;
}

Fondos (backgrounds)

Selectores CSS

Last modified 4yr ago

Copy link

On this page

position: relative

position: absolute

position: fixed