100% Height with CSS

Ir al contenido

Ir a la Búsqueda - Accesskey = s

January 10th, 2007

Enviar por e-mail

(3 votos, promedio: 1 de 4)

Loading ...

EncontrÃ© un interesante artÃculo que nos muestra como lograr alturas del 100% en un contenedor/pÃ¡gina utilizando CSS.

Although not that widely supported, I have found a way to make 100% height with CSS work in IE, Firefox and Opera. Three of the most major browsers right now. Today, I show you how to accomplish this fun little trick. First we must look at the html and body tags. In CSSâ€™ eyes, these tags are block level elements. Meaning by default that they have a value of auto height and width. Changing these values in your CSS, you can quickly add 100% height to your design.

El CSS:

<style> html, body {margin: 0; padding: 0;} html, body, div {height: 100%;} div {width: 50%; background-color: green; margin: 0px auto 0px; text-align: center; padding: 20px;}</style>

El cÃ³digo en acciÃ³n aquÃ!

Artículos Posiblemente Relacionados

Suscríbete a los comentarios con RSS o haz un TrackBack a '100% Height with CSS'.

Comenta aquí

Archivos

Acerca del Autor

Michael Müller C. es un diseñador y desarrollador de sitios web radicado en Guayaquil, Ecuador. Creador de MMC Design en 1998 y de Iconiza en el 2007.