Atributo overflow de CSS

Definición y uso

overflow Esta propiedad especifica qué sucede cuando el contenido excede el cuadro del elemento.

Descripción

Esta propiedad define cómo se manejará el contenido de la zona de desbordamiento del elemento. Si el valor es scroll, el agente de usuario proporcionará un mecanismo de desplazamiento, independientemente de si se necesita o no. Por lo tanto, es posible que incluso si todo el contenido cabe en el cuadro del elemento, aparezca una barra de desplazamiento.

Véase también:

Tutoriales CSS:Posicionamiento CSS

Manual de referencia del HTML DOM:Propiedad overflow

Ejemplo

Configurar la propiedad overflow:

div
  {
  width:150px;
  height:150px;
  overflow:scroll;
  }

Prueba tu mismo

Sintaxis de CSS

overflow: visible|hidden|clip|scroll|auto|initial|inherit;

Valor del atributo

Valor Descripción
visible Valor predeterminado. El contenido no se recortará y se mostrará fuera del cuadro del elemento.
hidden El contenido se recortará y el resto del contenido no será visible.
scroll El contenido se recortará, pero el navegador mostrará una barra de desplazamiento para ver el resto del contenido.
auto Si el contenido se recorta, el navegador mostrará una barra de desplazamiento para ver el resto del contenido.
inherit Se especifica que la propiedad overflow debe heredar su valor del elemento padre.

Detalles técnicos

Valor predeterminado: visible
Herencia: no
Versión: CSS2
Sintaxis de JavaScript: object.style.overflow="scroll"

Más ejemplos

Cómo usar las barras de desplazamiento para mostrar el contenido que desborda dentro del elemento
Este ejemplo muestra cómo configurar la propiedad overflow para definir la acción correspondiente cuando el contenido del elemento excede el área especificada.
Cómo ocultar el contenido que desborda en un elemento
Este ejemplo muestra cómo configurar la propiedad overflow para ocultar el contenido cuando el contenido del elemento es demasiado grande para adaptarse al área especificada.
Cómo configurar el navegador para que maneje automáticamente el desbordamiento
Este ejemplo muestra cómo configurar el navegador para que maneje automáticamente el desbordamiento.

Compatibilidad del navegador

Los números en la tabla indican la primera versión del navegador que completamente soporta esta propiedad.

Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 7.0