Cómo dar height: 100% a un DIV con CSS en Firefox3 e IE7

Charlando con un colega nos ha surgido la duda de cómo podríamos crear un DIV que fuese el wrapper de la página y tuviese el height 100%, de forma que se adapte a la altura del navegador. La solución, que reconozco que hemos tardado en dar con ella, es muy sencilla y se resuelve con unas pocas líneas en el CSS:

html,body{

margin:0px;
height:100%;

}

#wrapper{

height: 100%

}

De todos modos, sigo pensando que dar un height automático al contenedor principal  de una página es antiestético y muchas veces nos encontraremos con problemas al visualizar la página en determinados navegadores. Lo ideal sería poner un height fijo cuando sabemos que la altura de la página nunca va a variar (típicas páginas básicas de empresas con pocos textos).

Etiquetas:,

Suscríbete a nuestro Feed para recibir las últimas novedades de diseño web, diseño gráfico y programación

1 Comentario hasta el momento »

  1. obdc el caminp dijo

    15 de octubre del 2010 a las 16:03

    En cuanto a ello porque no resolverlo con dos div uno que de la altura maxima de la pantalla y otro que contenga el texto, por cierto esto solo funciona con explorer en firefox no funciona para ello es necesario dar una posicion de preferencia relativa:

    html,body{

    margin:0;
    height:100%;

    }

    #wrapper{

    height: 100%;
    position:relative

    }

Comentarios RSS · TrackBack URI

Dejanos tu Comentario

Nombre: (Requerido)

E-Mail: (Requerido)

Sitio WEB:

Comentario:

What is 3 + 4 ?
Please leave these two fields as-is: