Re: [Ovillo] solapamiento en un diseño a 3 columnas + pie
Almorca tiene razón, elimina los "position:absolute;" de "#esquerra" y "#dreta", no los necesitas. Así dejarán de encimarse entre sí y sobre el footer. Saludos Jorge Noricumbo nomás.. - Original Message From: Edu G. - xadap <[EMAIL PROTECTED]> To: "Ovillo, la lista de CSS en castellano" Sent: Monday, December 24, 2007 4:32:15 PM Subject: Re: [Ovillo] solapamiento en un diseño a 3 columnas + pie buenas, hemos aplicado los cambios que nos decía Almorca y no conseguimos que se vea correctamente todavía :( ¿alguna otra idea? Saludos! Edu On Dec 23, 2007 11:59 PM, Almorca <[EMAIL PROTECTED]> wrote: > No puedes usar clear: both porque para posicionar las columnas no usas float > sino que usa position: absolute. > > Pon a cada columna float: left; y luego al footer clear: both; y elimina los > position y los top y left. > > El día 23/12/07, Edu G. - xadap <[EMAIL PROTECTED]> escribió: > > > > > Hola, > > > > Tenemos un problema con las cajas flotantes: dos de ellas que usamos > > para los menús se nos solapan con la del footer y no encontramos la > > manera de solucionarlo. Después de buscar por diversas páginas de > > internet hemos jugado con el clear: both; en distintas posiciones y > > ninguna ha dado un resultado satisfactorio. La web en cuestión es > > ésta: > > http://www.musicalliure.net/bloc/canvis-a-la-portada/ > > > > ¿Alguna idea? > > Gracias :) > > > > -- > > tac822.net > > MusicaLliure.net > > ___ > > Lista de distribución Ovillo > > Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org > > Puedes modificar tus datos o desuscribirte en la siguiente dirección: > > http://lists.ovillo.org/mailman/listinfo/ovillo > > > > > > -- > We don't need no education - Pink Floyd > ___ > Lista de distribución Ovillo > Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org > Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo > -- tac822.net MusicaLliure.net ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org 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 Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] solapamiento en un diseño a 3 columnas + pie
buenas, hemos aplicado los cambios que nos decía Almorca y no conseguimos que se vea correctamente todavía :( ¿alguna otra idea? Saludos! Edu On Dec 23, 2007 11:59 PM, Almorca <[EMAIL PROTECTED]> wrote: > No puedes usar clear: both porque para posicionar las columnas no usas float > sino que usa position: absolute. > > Pon a cada columna float: left; y luego al footer clear: both; y elimina los > position y los top y left. > > El día 23/12/07, Edu G. - xadap <[EMAIL PROTECTED]> escribió: > > > > > Hola, > > > > Tenemos un problema con las cajas flotantes: dos de ellas que usamos > > para los menús se nos solapan con la del footer y no encontramos la > > manera de solucionarlo. Después de buscar por diversas páginas de > > internet hemos jugado con el clear: both; en distintas posiciones y > > ninguna ha dado un resultado satisfactorio. La web en cuestión es > > ésta: > > http://www.musicalliure.net/bloc/canvis-a-la-portada/ > > > > ¿Alguna idea? > > Gracias :) > > > > -- > > tac822.net > > MusicaLliure.net > > ___ > > Lista de distribución Ovillo > > Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org > > Puedes modificar tus datos o desuscribirte en la siguiente dirección: > > http://lists.ovillo.org/mailman/listinfo/ovillo > > > > > > -- > We don't need no education - Pink Floyd > ___ > Lista de distribución Ovillo > Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org > Puedes modificar tus datos o desuscribirte en la siguiente dirección: > http://lists.ovillo.org/mailman/listinfo/ovillo > -- tac822.net MusicaLliure.net ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Problema haciendo columna 100% alta
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:
> >
> >
> >
> >
> >
> >
> >
> >
> >
> >
> >
> > Un saludo y gracias de antemano.
> > ___
> > Lista de distribución Ovillo
> > Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
> > 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 Ovillo@lists.ovillo.org
> 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 Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Problema haciendo columna 100% alta
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:
>
>
>
>
>
>
>
>
>
>
>
> Un saludo y gracias de antemano.
> ___
> Lista de distribución Ovillo
> Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
> 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 Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
