Mundo
del Programador

Overflow y Z-index


Overflow

Normalmente los contenidos de un elemento se pueden mostrar en el espacio reservado par aese elemento. Sin embargo, alguna ocasiones el contenido de un elemento no cabe en el espacio reservado para este elemetno y se desborda. La situación más habitual en la que el contendio sobresale de un espacio reservado es cuando se establece la altura y anchura de un elemento mediante las propriedades width y height. Las propriedades de overflow son:

  • visible es el valor por defecto
  • hidden el contendio sobrante se oculta y únicamente se visualizará la parte del contenido que cabe dentro de la zona reservada para el elemento
  • scroll solamente se visualiza el contenido que cabe dentro de la zona reservada para el elemento, pero se muestra una barra de scroll que permite visualizar el resto del contenido
  • auto el coportamiento depende del navegador, aunque normalmetne es el mismo que la propriedad scroll. Es un comportamiento desaconsejado.


Z-index

Se utiliza para crear paginas complejas con varios niveles de caja. Se considera el 0 como el valor más bajo aunque se pueden utilizar números negativos. Esta propriedad sólo tiene efecto en los elementos posicionados, por lo que es obligatorio que la propriedad z-index vaya acompañada de la propriedad position. Si debes posicionar un elemento pero no quieres moverlo de su posición original ni afectar el resto de elementos de la página, puede utilizar el posicionamiento relativo.

Ejercicios resueltos en github



Siguiente
Anterior