Sobre eso ya se habló también hace bastante en la lista, y alguien lo redacto para escribir un artículo en su blog, creo que está escrito en inglés.
El caso es que esta técnica está muy bien, pero tiene un pequeño problema con los movimientos dentro de la página para saltar contenidos, o moverse por el documento. Creo que lo terminaban resolviendo estos problemas con Javascript, aquí dejo el enlace al artículo por si pudiera interesar que lo acabo de encontrar: http://blog.corunet.com/english/three-column-layout-with-full-page-height En los comentarios al artículo alguien puso un enlace a los diferetnes problemas que puede tener esta solución, recomiendo revisarlos porque están muy bien y seguro que dan solución a ellos. Un saludo El día 24/12/07, jaume op <[EMAIL PROTECTED]> escribió: > > Esto (o muy similar) se comento hace unos dias mira a ver si te sirve, > creo > que podras acomodarlo sin problemas. > http://www.csslab.cl/2007/10/11/100-alto-finalmente-para-todos/ > > > El día 23/12/07, Paco <[EMAIL PROTECTED]> escribió: > > > > Hola! > > > > Estoy rediseñando un sitio web (partiendo de una plantilla de Layout > > Gala) y me ha surgido un problema que no consigo resolver, no paro de > > darle vueltas y cuando consigo solucionarlo por una parte sale un > > problema por otra. > > > > El problema está en hacer la columna de navegación 100% alta. Lo he > > solucionado con el siguiente código: > > > > body, html, #wrapper, #content, #navigation, #container { > > height: 100%; > > } > > > > Pero surge otro problema: ahora cuando escribo cierta cantidad de texto > > en #content, éste sale por debajo del pie destrozando el diseño de la > > web. ¿Alguien sabe cómo puedo solucionar este problema? estoy deseando > > tener ya una nueva plantilla para sustituir la que hay ahora > > funcionando, que es deficiente. > > > > html,body{margin:0px 0px 0px 0px;padding:0} > > body{font: 76% verdana, arial, helvetica, sans-serif; > > } > > p{margin:0 10px 10px 0px;} > > > > div#header {height:84px;line-height:80px;margin:0; > > padding-left:0px;background: #EEE;color: #79B30B; > > background-image:url('lineaHoriz.jpg'); > > } > > div#content { padding-left: 20px; border: 1px solid;} > > div#navigation{background:#FFD990; > > background-image: url('degradado.jpg'); > > background-repeat: repeat-y; > > background-position: top right; > > } > > div#footer{ > > background: #FFD990;color: #000; > > background-image:url('lineaHorizAbajo.jpg'); > > padding-top:5px; > > } > > div#footer p{margin:0; height: 19px;} > > > > div#wrapper{top: -3px; float:right;width:100%;margin-left:-200px} > > div#content{margin-left:194px} > > div#navigation{float:left;width:194px} > > div#footer{clear:both;width:100%} > > > > body, html, #wrapper, #content, #navigation, #container { > > height: 100%; > > } > > > > Estructura del html: > > > > <div id="container"> > > <div id="header"></div> > > <div id="wrapper"> > > <div id="content"> > > </div> > > </div> > > <div id="navigation"></div> > > <div id="footer"></div> > > </div> > > > > Un saludo y gracias de antemano. > > _______________________________________________ > > Lista de distribución Ovillo > > Para escribir a la lista, envia un correo a [email protected] > > Puedes modificar tus datos o desuscribirte en la siguiente dirección: > > http://lists.ovillo.org/mailman/listinfo/ovillo > > > _______________________________________________ > Lista de distribución Ovillo > Para escribir a la lista, envia un correo a [email protected] > Puedes modificar tus datos o desuscribirte en la siguiente dirección: > http://lists.ovillo.org/mailman/listinfo/ovillo > _______________________________________________ Lista de distribución Ovillo Para escribir a la lista, envia un correo a [email protected] Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
