Posts Tagged ‘desbordamiento’

Simulando iFrames

Martes, Octubre 14th, 2008

Podría haber puesto un título menos interesante(como si este lo fuera), pero más de una vez tuve que hacer esto en algún que otro proyecto, porque el cliente la mayoría de las veces es gente que se quedó en 1998. Pero en fin.

Una propiedad bastante útil a la hora de manejar contenido extenso dentro de un div es la propiedad overflow. Básicamente lo que hace es agregar o no barras de desplazamiento dentro del objeto(en este caso, un div). Es decir, el control sobre desbordamiento de contenido.

Para que la propiedad funcione solo hace falta establecer las dimensiones del objeto(pueden no aplicarse, en este caso el objeto tomaría el ancho de su objeto padre-bien podría ser body)

.divContenidoExtenso{
width: 250px;
height: 200px;
overflow: auto;
}

Este sería la manera más básica de aplicar overflow. Existen otros valores muy útiles para esta propiedad.

  • overflow: visible; No se muestran las barras de desplazamiento, pero deja que el contenido exceda los limites del objeto.
  • overflow: auto; El valor más usado a la hora de usar esta propiedad, las barras de desplazamiento se muestran solo cuando los limites son excedidos por el contenido(y, obviamente, el contenido no excede los limites nunca).
  • overflow: scroll; Las barras de desplazamiento se muestran siempre, sin importar el contenido, deshabilitadas. Y se habilitan en el momento que el contenido excede los limites.

Pero mejor que leer es ver, así que por acá pueden ver un pequeño ejemplo.