[Ovillo] Diseño de 3 columnas
Hola amigos: Tengo una duda a ver si hay alguna solución. No puedo enseñaros nada, pero espero explicarme bien. Estoy diseñando un site de 3 columnas. La izquierda y central con float:left y la derecha con float:right. El izquierdo y derecho miden 200px y el central 500px (el ancho total es de 900px). El problema viene porque quiero a veces mostrar y ocultar la columna de la derecha, pero claro y lógico, la columna central no se escala porque tiene un tamaño fijo de 500px. Queria saber si es posible maquetar esto de las 3 columnas, pero de forma que al ocultar la columna de la derecha, el central se me estire y pase a medir 700px. Espero haberme explicado claramente. 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://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Diseño de 3 columnas
Hola Javier, no seria mejor que utilices medidas relativas y hacer una plantilla liquida? Te solucionaria el problema. http://www.econsultant.com/web-developer/ Javier Prieto [EMAIL PROTECTED] escribió: Hola amigos: Tengo una duda a ver si hay alguna solución. No puedo enseñaros nada, pero espero explicarme bien. Estoy diseñando un site de 3 columnas. La izquierda y central con float:left y la derecha con float:right. El izquierdo y derecho miden 200px y el central 500px (el ancho total es de 900px). El problema viene porque quiero a veces mostrar y ocultar la columna de la derecha, pero claro y lógico, la columna central no se escala porque tiene un tamaño fijo de 500px. Queria saber si es posible maquetar esto de las 3 columnas, pero de forma que al ocultar la columna de la derecha, el central se me estire y pase a medir 700px. Espero haberme explicado claramente. 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://ovillo.org/mailman/listinfo/ovillo Gerard Boyer Ballesteros Bloc personal: http://blocs.tinet.org/blog/blocger-i-ara-que - LLama Gratis a cualquier PC del Mundo. Llamadas a fijos y móviles desde 1 céntimo por minuto. http://es.voice.yahoo.com ___ 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://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Diseño de 3 columnas
Eso sería perfecto, pero el diseño del portal tiene que tener un ancho fijo de 900px Lo que tiene que ser flujida es la columna central dependiendo de la derecha como os comentaba. Sigo investigando Gerard Boyer escribió: Hola Javier, no seria mejor que utilices medidas relativas y hacer una plantilla liquida? Te solucionaria el problema. http://www.econsultant.com/web-developer/ Javier Prieto [EMAIL PROTECTED] escribió: Hola amigos: Tengo una duda a ver si hay alguna solución. No puedo enseñaros nada, pero espero explicarme bien. Estoy diseñando un site de 3 columnas. La izquierda y central con float:left y la derecha con float:right. El izquierdo y derecho miden 200px y el central 500px (el ancho total es de 900px). El problema viene porque quiero a veces mostrar y ocultar la columna de la derecha, pero claro y lógico, la columna central no se escala porque tiene un tamaño fijo de 500px. Queria saber si es posible maquetar esto de las 3 columnas, pero de forma que al ocultar la columna de la derecha, el central se me estire y pase a medir 700px. Espero haberme explicado claramente. 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://ovillo.org/mailman/listinfo/ovillo Gerard Boyer Ballesteros Bloc personal: http://blocs.tinet.org/blog/blocger-i-ara-que - LLama Gratis a cualquier PC del Mundo. Llamadas a fijos y móviles desde 1 céntimo por minuto. http://es.voice.yahoo.com ___ 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://ovillo.org/mailman/listinfo/ovillo __ Información de NOD32, revisión 1.1677 (20060724) __ Este mensaje ha sido analizado con NOD32 antivirus system http://www.nod32.com ___ 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://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Diseño de 3 columnas
Hola Javier, no puedes poner las tres cajas dentro de un container de 900px y las interiores jugar con unidades relativas? Javier Prieto [EMAIL PROTECTED] escribió: Eso sería perfecto, pero el diseño del portal tiene que tener un ancho fijo de 900px Lo que tiene que ser flujida es la columna central dependiendo de la derecha como os comentaba. Sigo investigando Gerard Boyer escribió: Hola Javier, no seria mejor que utilices medidas relativas y hacer una plantilla liquida? Te solucionaria el problema. http://www.econsultant.com/web-developer/ Javier Prieto escribió: Hola amigos: Tengo una duda a ver si hay alguna solución. No puedo enseñaros nada, pero espero explicarme bien. Estoy diseñando un site de 3 columnas. La izquierda y central con float:left y la derecha con float:right. El izquierdo y derecho miden 200px y el central 500px (el ancho total es de 900px). El problema viene porque quiero a veces mostrar y ocultar la columna de la derecha, pero claro y lógico, la columna central no se escala porque tiene un tamaño fijo de 500px. Queria saber si es posible maquetar esto de las 3 columnas, pero de forma que al ocultar la columna de la derecha, el central se me estire y pase a medir 700px. Espero haberme explicado claramente. 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://ovillo.org/mailman/listinfo/ovillo Gerard Boyer Ballesteros Bloc personal: http://blocs.tinet.org/blog/blocger-i-ara-que - LLama Gratis a cualquier PC del Mundo. Llamadas a fijos y móviles desde 1 céntimo por minuto. http://es.voice.yahoo.com ___ 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://ovillo.org/mailman/listinfo/ovillo __ Información de NOD32, revisión 1.1677 (20060724) __ Este mensaje ha sido analizado con NOD32 antivirus system http://www.nod32.com ___ 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://ovillo.org/mailman/listinfo/ovillo Gerard Boyer Ballesteros Bloc personal: http://blocs.tinet.org/blog/blocger-i-ara-que - LLama Gratis a cualquier PC del Mundo. Llamadas a fijos y móviles desde 1 céntimo por minuto. http://es.voice.yahoo.com ___ 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://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Diseño de 3 columnas
De todas formas, si pongo por ejemplo la columna left a 20%, la right a 20% y la center a 60% cuando no aparezca la columna right, center seguirá siendo del 60% por lo que no ocupará el espacio del right ¿Me explico bien? Puf, eso espero saludos Gerard Boyer escribió: Hola Javier, no puedes poner las tres cajas dentro de un container de 900px y las interiores jugar con unidades relativas? Javier Prieto [EMAIL PROTECTED] escribió: Eso sería perfecto, pero el diseño del portal tiene que tener un ancho fijo de 900px Lo que tiene que ser flujida es la columna central dependiendo de la derecha como os comentaba. Sigo investigando Gerard Boyer escribió: Hola Javier, no seria mejor que utilices medidas relativas y hacer una plantilla liquida? Te solucionaria el problema. http://www.econsultant.com/web-developer/ Javier Prieto escribió: Hola amigos: Tengo una duda a ver si hay alguna solución. No puedo enseñaros nada, pero espero explicarme bien. Estoy diseñando un site de 3 columnas. La izquierda y central con float:left y la derecha con float:right. El izquierdo y derecho miden 200px y el central 500px (el ancho total es de 900px). El problema viene porque quiero a veces mostrar y ocultar la columna de la derecha, pero claro y lógico, la columna central no se escala porque tiene un tamaño fijo de 500px. Queria saber si es posible maquetar esto de las 3 columnas, pero de forma que al ocultar la columna de la derecha, el central se me estire y pase a medir 700px. Espero haberme explicado claramente. 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://ovillo.org/mailman/listinfo/ovillo Gerard Boyer Ballesteros Bloc personal: http://blocs.tinet.org/blog/blocger-i-ara-que - LLama Gratis a cualquier PC del Mundo. Llamadas a fijos y móviles desde 1 céntimo por minuto. http://es.voice.yahoo.com ___ 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://ovillo.org/mailman/listinfo/ovillo __ Información de NOD32, revisión 1.1677 (20060724) __ Este mensaje ha sido analizado con NOD32 antivirus system http://www.nod32.com ___ 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://ovillo.org/mailman/listinfo/ovillo Gerard Boyer Ballesteros Bloc personal: http://blocs.tinet.org/blog/blocger-i-ara-que - LLama Gratis a cualquier PC del Mundo. Llamadas a fijos y móviles desde 1 céntimo por minuto. http://es.voice.yahoo.com ___ 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://ovillo.org/mailman/listinfo/ovillo __ Información de NOD32, revisión 1.1677 (20060724) __ Este mensaje ha sido analizado con NOD32 antivirus system http://www.nod32.com ___ 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://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Diseño de 3 columnas
http://www.thenoodleincident.com/tutorials/box_lesson/boxes.html -Mensaje original- De: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] En nombre de Javier Prieto Enviado el: martes, 25 de julio de 2006 12:08 Para: Ovillo, la lista de CSS en castellano Asunto: Re: [Ovillo] Diseño de 3 columnas De todas formas, si pongo por ejemplo la columna left a 20%, la right a 20% y la center a 60% cuando no aparezca la columna right, center seguirá siendo del 60% por lo que no ocupará el espacio del right ¿Me explico bien? Puf, eso espero saludos Gerard Boyer escribió: Hola Javier, no puedes poner las tres cajas dentro de un container de 900px y las interiores jugar con unidades relativas? Javier Prieto [EMAIL PROTECTED] escribió: Eso sería perfecto, pero el diseño del portal tiene que tener un ancho fijo de 900px Lo que tiene que ser flujida es la columna central dependiendo de la derecha como os comentaba. Sigo investigando Gerard Boyer escribió: Hola Javier, no seria mejor que utilices medidas relativas y hacer una plantilla liquida? Te solucionaria el problema. http://www.econsultant.com/web-developer/ Javier Prieto escribió: Hola amigos: Tengo una duda a ver si hay alguna solución. No puedo enseñaros nada, pero espero explicarme bien. Estoy diseñando un site de 3 columnas. La izquierda y central con float:left y la derecha con float:right. El izquierdo y derecho miden 200px y el central 500px (el ancho total es de 900px). El problema viene porque quiero a veces mostrar y ocultar la columna de la derecha, pero claro y lógico, la columna central no se escala porque tiene un tamaño fijo de 500px. Queria saber si es posible maquetar esto de las 3 columnas, pero de forma que al ocultar la columna de la derecha, el central se me estire y pase a medir 700px. Espero haberme explicado claramente. 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://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Diseño de 3 columnas
Saludos, Javier Prieto escribió: Hola amigos: Tengo una duda a ver si hay alguna solución. No puedo enseñaros nada, pero espero explicarme bien. Estoy diseñando un site de 3 columnas. La izquierda y central con float:left y la derecha con float:right. El izquierdo y derecho miden 200px y el central 500px (el ancho total es de 900px). El problema viene porque quiero a veces mostrar y ocultar la columna de la derecha, pero claro y lógico, la columna central no se escala porque tiene un tamaño fijo de 500px. ¿Mostrar/ocultar cómo? Ideas (no he probado peeero): 1. Si muestras/ocultas el panel derecho haciendo clic en algún enlace o similar la idea es combinar javascript con un panel central cuyo ancho sea líquido. a través de javascript deerás cambiar la propiedad de disposición del panel derecho a display:none; para ocultar. 2. Si muestras/ocultas al cargar un nuevo archivo .html... ¿por qué no puedes usar dos layouts? Queria saber si es posible maquetar esto de las 3 columnas, pero de forma que al ocultar la columna de la derecha, el central se me estire y pase a medir 700px. Otra idea que no he cotejado pero podría ser buena: Expressions (javascript en tu CSS). Así, para indicarle al panel central qué ancho debe tomar (por ejemplo, según si está el objeto div con propiedad 'id=panel_derecho o no)'. Es sólo una teoria, pero creo que puede valer. Ya me corregirán si me equivoco :-P Espero haberme explicado claramente. Perfectamente. Yo lamento no tener muestras exactas de lo que te digo... Por si no lo sabes, para que veas cómo funciona Expressions puedes ver el enlace más abajo [1]. Es de un ejemplo que enlazó Orange en esta misma lista. Espero que te sirva como base para el js correcto. [1] http://www.abelsutilo.com/documentos/ovillo/ancho_adaptable/ Un saludo y gracias de antemano Un saludo, Abel ___ 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://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://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Diseño de 3 columnas
Creo que me he explicado mal: Tal como está siendo diseñado/programado el site a veces tengo 3 columnas (left, center y rught) y a veces dos (left y center). No hay posibilidad de hacer dos layouts. Planteo de otra forma la pregunta porque no consigo de ninguna manera la solución. Si tengo left flotando a la izquierda y con un ancho de 200px, right flotando a la derecha y con un ancho de 200px ¿cómo puedo poner el dive center en medio de los dos y ocupando el ancho que falta hasta completar los 900px pero sin darle un ancho fijo? No sé, igual no hay solución. Gracias por vuestro interés a los que habeis contestado Abel Sutilo escribió: Saludos, Javier Prieto escribió: Hola amigos: Tengo una duda a ver si hay alguna solución. No puedo enseñaros nada, pero espero explicarme bien. Estoy diseñando un site de 3 columnas. La izquierda y central con float:left y la derecha con float:right. El izquierdo y derecho miden 200px y el central 500px (el ancho total es de 900px). El problema viene porque quiero a veces mostrar y ocultar la columna de la derecha, pero claro y lógico, la columna central no se escala porque tiene un tamaño fijo de 500px. ¿Mostrar/ocultar cómo? Ideas (no he probado peeero): 1. Si muestras/ocultas el panel derecho haciendo clic en algún enlace o similar la idea es combinar javascript con un panel central cuyo ancho sea líquido. a través de javascript deerás cambiar la propiedad de disposición del panel derecho a display:none; para ocultar. 2. Si muestras/ocultas al cargar un nuevo archivo .html... ¿por qué no puedes usar dos layouts? Queria saber si es posible maquetar esto de las 3 columnas, pero de forma que al ocultar la columna de la derecha, el central se me estire y pase a medir 700px. Otra idea que no he cotejado pero podría ser buena: Expressions (javascript en tu CSS). Así, para indicarle al panel central qué ancho debe tomar (por ejemplo, según si está el objeto div con propiedad 'id=panel_derecho o no)'. Es sólo una teoria, pero creo que puede valer. Ya me corregirán si me equivoco :-P Espero haberme explicado claramente. Perfectamente. Yo lamento no tener muestras exactas de lo que te digo... Por si no lo sabes, para que veas cómo funciona Expressions puedes ver el enlace más abajo [1]. Es de un ejemplo que enlazó Orange en esta misma lista. Espero que te sirva como base para el js correcto. [1] http://www.abelsutilo.com/documentos/ovillo/ancho_adaptable/ Un saludo y gracias de antemano Un saludo, Abel ___ 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://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://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://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Diseño de 3 columnas
Uy Abel, no vi el enlace que me mandabas más abajo lo voy a probar. Muchas gracias Abel Sutilo escribió: Saludos, Javier Prieto escribió: Hola amigos: Tengo una duda a ver si hay alguna solución. No puedo enseñaros nada, pero espero explicarme bien. Estoy diseñando un site de 3 columnas. La izquierda y central con float:left y la derecha con float:right. El izquierdo y derecho miden 200px y el central 500px (el ancho total es de 900px). El problema viene porque quiero a veces mostrar y ocultar la columna de la derecha, pero claro y lógico, la columna central no se escala porque tiene un tamaño fijo de 500px. ¿Mostrar/ocultar cómo? Ideas (no he probado peeero): 1. Si muestras/ocultas el panel derecho haciendo clic en algún enlace o similar la idea es combinar javascript con un panel central cuyo ancho sea líquido. a través de javascript deerás cambiar la propiedad de disposición del panel derecho a display:none; para ocultar. 2. Si muestras/ocultas al cargar un nuevo archivo .html... ¿por qué no puedes usar dos layouts? Queria saber si es posible maquetar esto de las 3 columnas, pero de forma que al ocultar la columna de la derecha, el central se me estire y pase a medir 700px. Otra idea que no he cotejado pero podría ser buena: Expressions (javascript en tu CSS). Así, para indicarle al panel central qué ancho debe tomar (por ejemplo, según si está el objeto div con propiedad 'id=panel_derecho o no)'. Es sólo una teoria, pero creo que puede valer. Ya me corregirán si me equivoco :-P Espero haberme explicado claramente. Perfectamente. Yo lamento no tener muestras exactas de lo que te digo... Por si no lo sabes, para que veas cómo funciona Expressions puedes ver el enlace más abajo [1]. Es de un ejemplo que enlazó Orange en esta misma lista. Espero que te sirva como base para el js correcto. [1] http://www.abelsutilo.com/documentos/ovillo/ancho_adaptable/ Un saludo y gracias de antemano Un saludo, Abel ___ 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://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://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://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Diseño de 3 columnas
Hola Javier, El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió: Estoy diseñando un site de 3 columnas. La izquierda y central con float:left y la derecha con float:right. El izquierdo y derecho miden 200px y el central 500px (el ancho total es de 900px). El problema viene porque quiero a veces mostrar y ocultar la columna de la derecha, pero claro y lógico, la columna central no se escala porque tiene un tamaño fijo de 500px. Queria saber si es posible maquetar esto de las 3 columnas, pero de forma que al ocultar la columna de la derecha, el central se me estire y pase a medir 700px. podrías mandar la dirección donde estás probando la página, o en su defecto, copiar-pegar el código HTML y la hoja de estilos que estás usando. Creo que te podríamos dar una respuesta más apropiada. Gracias desde ya. -- Hugo A. Valencia ___ 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://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Diseño de 3 columnas
He creado un ejemplo sencillo en local porque no tengo url que pasaros
He puesto dos ejemplos, uno con el div right y otro sin él.
Lo que quiero conseguir es que el div center se estire en el segundo
caso ocupando el espacio dejado por right
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html; charset=iso-8859-1 /
titlePrueba de DIV CENTRAL fluido/title
style
#contenedor {
position: relative;
width: 900px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
background-color: #CC;
}
#left {
float: left;
width: 200px;
background-color: #99;
}
#center {
float: left;
min-width: 500px;
max-width: 700px;
width: auto !important;
background-color: #006600;
}
#right {
float:right;
width: 200px;
background-color: #99;
}
/style
/head
body
!-- Prueba de poner un layout de 3 columnas donde la del medio es
fluida para que en el caso de que la derecha desaparezca, la central se
estire para ocupar su lugar --
div id=contenedor
div id=leftnbsp;/div
div id=centernbsp;/div
div id=rightnbsp;/div
div style=clear:both/div
/div
br /br /
div id=contenedor
div id=leftnbsp;/div
div id=centernbsp;/div
div style=clear:both/div
/div
/body
/html
Hugo A. Valencia escribió:
Hola Javier,
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
Estoy diseñando un site de 3 columnas.
La izquierda y central con float:left y la derecha con float:right.
El izquierdo y derecho miden 200px y el central 500px (el ancho total es
de 900px).
El problema viene porque quiero a veces mostrar y ocultar la columna de
la derecha, pero claro y lógico, la columna central no se escala porque
tiene un tamaño fijo de 500px.
Queria saber si es posible maquetar esto de las 3 columnas, pero de
forma que al ocultar la columna de la derecha, el central se me estire y
pase a medir 700px.
podrías mandar la dirección donde estás probando la página,
o en su defecto, copiar-pegar el código HTML y la hoja
de estilos que estás usando.
Creo que te podríamos dar una respuesta más apropiada.
Gracias desde ya.
___
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://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Diseño de 3 columnas
Hola Javier,
Prueba a aplicarle a center
padding: 0 0 0 ANCHO_DE_LEFTpx;
Saludo,
DJ-Dom
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
He creado un ejemplo sencillo en local porque no tengo url que pasaros
He puesto dos ejemplos, uno con el div right y otro sin él.
Lo que quiero conseguir es que el div center se estire en el segundo
caso ocupando el espacio dejado por right
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html; charset=iso-8859-1 /
titlePrueba de DIV CENTRAL fluido/title
style
#contenedor {
position: relative;
width: 900px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
background-color: #CC;
}
#left {
float: left;
width: 200px;
background-color: #99;
}
#center {
float: left;
min-width: 500px;
max-width: 700px;
width: auto !important;
background-color: #006600;
}
#right {
float:right;
width: 200px;
background-color: #99;
}
/style
/head
body
!-- Prueba de poner un layout de 3 columnas donde la del medio es
fluida para que en el caso de que la derecha desaparezca, la central se
estire para ocupar su lugar --
div id=contenedor
div id=leftnbsp;/div
div id=centernbsp;/div
div id=rightnbsp;/div
div style=clear:both/div
/div
br /br /
div id=contenedor
div id=leftnbsp;/div
div id=centernbsp;/div
div style=clear:both/div
/div
/body
/html
Hugo A. Valencia escribió:
Hola Javier,
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
Estoy diseñando un site de 3 columnas.
La izquierda y central con float:left y la derecha con float:right.
El izquierdo y derecho miden 200px y el central 500px (el ancho total es
de 900px).
El problema viene porque quiero a veces mostrar y ocultar la columna de
la derecha, pero claro y lógico, la columna central no se escala porque
tiene un tamaño fijo de 500px.
Queria saber si es posible maquetar esto de las 3 columnas, pero de
forma que al ocultar la columna de la derecha, el central se me estire y
pase a medir 700px.
podrías mandar la dirección donde estás probando la página,
o en su defecto, copiar-pegar el código HTML y la hoja
de estilos que estás usando.
Creo que te podríamos dar una respuesta más apropiada.
Gracias desde ya.
___
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://ovillo.org/mailman/listinfo/ovillo
--
www.dj-dom.net
[EMAIL PROTECTED]
___
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://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Diseño de 3 columnas
Dioss, tal como está el código que te mandé si le pongo
padding: 0 0 0 200px;
No funciona te ruego, te suplico, te imploro que si lo has
conseguido me pases el codigo
Gracias por el interés
DJ-Dom escribió:
Hola Javier,
Prueba a aplicarle a center
padding: 0 0 0 ANCHO_DE_LEFTpx;
Saludo,
DJ-Dom
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
He creado un ejemplo sencillo en local porque no tengo url que pasaros
He puesto dos ejemplos, uno con el div right y otro sin él.
Lo que quiero conseguir es que el div center se estire en el segundo
caso ocupando el espacio dejado por right
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html; charset=iso-8859-1 /
titlePrueba de DIV CENTRAL fluido/title
style
#contenedor {
position: relative;
width: 900px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
background-color: #CC;
}
#left {
float: left;
width: 200px;
background-color: #99;
}
#center {
float: left;
min-width: 500px;
max-width: 700px;
width: auto !important;
background-color: #006600;
}
#right {
float:right;
width: 200px;
background-color: #99;
}
/style
/head
body
!-- Prueba de poner un layout de 3 columnas donde la del medio es
fluida para que en el caso de que la derecha desaparezca, la central se
estire para ocupar su lugar --
div id=contenedor
div id=leftnbsp;/div
div id=centernbsp;/div
div id=rightnbsp;/div
div style=clear:both/div
/div
br /br /
div id=contenedor
div id=leftnbsp;/div
div id=centernbsp;/div
div style=clear:both/div
/div
/body
/html
Hugo A. Valencia escribió:
Hola Javier,
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
Estoy diseñando un site de 3 columnas.
La izquierda y central con float:left y la derecha con float:right.
El izquierdo y derecho miden 200px y el central 500px (el ancho total es
de 900px).
El problema viene porque quiero a veces mostrar y ocultar la columna de
la derecha, pero claro y lógico, la columna central no se escala porque
tiene un tamaño fijo de 500px.
Queria saber si es posible maquetar esto de las 3 columnas, pero de
forma que al ocultar la columna de la derecha, el central se me estire y
pase a medir 700px.
podrías mandar la dirección donde estás probando la página,
o en su defecto, copiar-pegar el código HTML y la hoja
de estilos que estás usando.
Creo que te podríamos dar una respuesta más apropiada.
Gracias desde ya.
___
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://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://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Diseño de 3 columnas
Dioss, tal como está el código que te mandé si le pongo
padding: 0 0 0 200px;
No funciona te ruego, te suplico, te imploro que si lo has
conseguido me pases el codigo
Gracias por el interés
DJ-Dom escribió:
Hola Javier,
Prueba a aplicarle a center
padding: 0 0 0 ANCHO_DE_LEFTpx;
Saludo,
DJ-Dom
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
He creado un ejemplo sencillo en local porque no tengo url que pasaros
He puesto dos ejemplos, uno con el div right y otro sin él.
Lo que quiero conseguir es que el div center se estire en el segundo
caso ocupando el espacio dejado por right
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html; charset=iso-8859-1 /
titlePrueba de DIV CENTRAL fluido/title
style
#contenedor {
position: relative;
width: 900px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
background-color: #CC;
}
#left {
float: left;
width: 200px;
background-color: #99;
}
#center {
float: left;
min-width: 500px;
max-width: 700px;
width: auto !important;
background-color: #006600;
}
#right {
float:right;
width: 200px;
background-color: #99;
}
/style
/head
body
!-- Prueba de poner un layout de 3 columnas donde la del medio es
fluida para que en el caso de que la derecha desaparezca, la central se
estire para ocupar su lugar --
div id=contenedor
div id=leftnbsp;/div
div id=centernbsp;/div
div id=rightnbsp;/div
div style=clear:both/div
/div
br /br /
div id=contenedor
div id=leftnbsp;/div
div id=centernbsp;/div
div style=clear:both/div
/div
/body
/html
Hugo A. Valencia escribió:
Hola Javier,
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
Estoy diseñando un site de 3 columnas.
La izquierda y central con float:left y la derecha con float:right.
El izquierdo y derecho miden 200px y el central 500px (el ancho total es
de 900px).
El problema viene porque quiero a veces mostrar y ocultar la columna de
la derecha, pero claro y lógico, la columna central no se escala porque
tiene un tamaño fijo de 500px.
Queria saber si es posible maquetar esto de las 3 columnas, pero de
forma que al ocultar la columna de la derecha, el central se me estire y
pase a medir 700px.
podrías mandar la dirección donde estás probando la página,
o en su defecto, copiar-pegar el código HTML y la hoja
de estilos que estás usando.
Creo que te podríamos dar una respuesta más apropiada.
Gracias desde ya.
___
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://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://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Diseño de 3 columnas
Hola Javier...
Has una prueba:
padding: 0 0 0 200px; /* right visible */
padding: 0 0 0 0; /* right no visible */
Saludo,
DJ-Dom
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
Dioss, tal como está el código que te mandé si le pongo
padding: 0 0 0 200px;
No funciona te ruego, te suplico, te imploro que si lo has
conseguido me pases el codigo
Gracias por el interés
DJ-Dom escribió:
Hola Javier,
Prueba a aplicarle a center
padding: 0 0 0 ANCHO_DE_LEFTpx;
Saludo,
DJ-Dom
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
He creado un ejemplo sencillo en local porque no tengo url que pasaros
He puesto dos ejemplos, uno con el div right y otro sin él.
Lo que quiero conseguir es que el div center se estire en el segundo
caso ocupando el espacio dejado por right
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html; charset=iso-8859-1 /
titlePrueba de DIV CENTRAL fluido/title
style
#contenedor {
position: relative;
width: 900px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
background-color: #CC;
}
#left {
float: left;
width: 200px;
background-color: #99;
}
#center {
float: left;
min-width: 500px;
max-width: 700px;
width: auto !important;
background-color: #006600;
}
#right {
float:right;
width: 200px;
background-color: #99;
}
/style
/head
body
!-- Prueba de poner un layout de 3 columnas donde la del medio es
fluida para que en el caso de que la derecha desaparezca, la central se
estire para ocupar su lugar --
div id=contenedor
div id=leftnbsp;/div
div id=centernbsp;/div
div id=rightnbsp;/div
div style=clear:both/div
/div
br /br /
div id=contenedor
div id=leftnbsp;/div
div id=centernbsp;/div
div style=clear:both/div
/div
/body
/html
Hugo A. Valencia escribió:
Hola Javier,
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
Estoy diseñando un site de 3 columnas.
La izquierda y central con float:left y la derecha con float:right.
El izquierdo y derecho miden 200px y el central 500px (el ancho total es
de 900px).
El problema viene porque quiero a veces mostrar y ocultar la columna de
la derecha, pero claro y lógico, la columna central no se escala porque
tiene un tamaño fijo de 500px.
Queria saber si es posible maquetar esto de las 3 columnas, pero de
forma que al ocultar la columna de la derecha, el central se me estire y
pase a medir 700px.
podrías mandar la dirección donde estás probando la página,
o en su defecto, copiar-pegar el código HTML y la hoja
de estilos que estás usando.
Creo que te podríamos dar una respuesta más apropiada.
Gracias desde ya.
___
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://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://ovillo.org/mailman/listinfo/ovillo
--
www.dj-dom.net
[EMAIL PROTECTED]
___
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://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Diseño de 3 columnas
Güenas:
Definitivamente me explico mal.. lo que quiero conseguir DJ Dom es
que en mi site se puede dar una de las posibilidades.. o está el
right... o no está y lo que quiero es que el div verde center se
estire en el segundo caso
snif snif esto me puede
Gracias de todas formas
DJ-Dom escribió:
Hola Javier...
Has una prueba:
padding: 0 0 0 200px; /* right visible */
padding: 0 0 0 0; /* right no visible */
Saludo,
DJ-Dom
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
Dioss, tal como está el código que te mandé si le pongo
padding: 0 0 0 200px;
No funciona te ruego, te suplico, te imploro que si lo has
conseguido me pases el codigo
Gracias por el interés
DJ-Dom escribió:
Hola Javier,
Prueba a aplicarle a center
padding: 0 0 0 ANCHO_DE_LEFTpx;
Saludo,
DJ-Dom
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
He creado un ejemplo sencillo en local porque no tengo url que pasaros
He puesto dos ejemplos, uno con el div right y otro sin él.
Lo que quiero conseguir es que el div center se estire en el segundo
caso ocupando el espacio dejado por right
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html; charset=iso-8859-1 /
titlePrueba de DIV CENTRAL fluido/title
style
#contenedor {
position: relative;
width: 900px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
background-color: #CC;
}
#left {
float: left;
width: 200px;
background-color: #99;
}
#center {
float: left;
min-width: 500px;
max-width: 700px;
width: auto !important;
background-color: #006600;
}
#right {
float:right;
width: 200px;
background-color: #99;
}
/style
/head
body
!-- Prueba de poner un layout de 3 columnas donde la del medio es
fluida para que en el caso de que la derecha desaparezca, la central se
estire para ocupar su lugar --
div id=contenedor
div id=leftnbsp;/div
div id=centernbsp;/div
div id=rightnbsp;/div
div style=clear:both/div
/div
br /br /
div id=contenedor
div id=leftnbsp;/div
div id=centernbsp;/div
div style=clear:both/div
/div
/body
/html
Hugo A. Valencia escribió:
Hola Javier,
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
Estoy diseñando un site de 3 columnas.
La izquierda y central con float:left y la derecha con float:right.
El izquierdo y derecho miden 200px y el central 500px (el ancho total es
de 900px).
El problema viene porque quiero a veces mostrar y ocultar la columna de
la derecha, pero claro y lógico, la columna central no se escala porque
tiene un tamaño fijo de 500px.
Queria saber si es posible maquetar esto de las 3 columnas, pero de
forma que al ocultar la columna de la derecha, el central se me estire y
pase a medir 700px.
podrías mandar la dirección donde estás probando la página,
o en su defecto, copiar-pegar el código HTML y la hoja
de estilos que estás usando.
Creo que te podríamos dar una respuesta más apropiada.
Gracias desde ya.
___
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://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://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://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Diseño de 3 columnas
Hola Javier dime algo, como piensas cambiar el tamaño de central?
Porque si lo que quieres es llevarla de 500px a 700px puedes hacer dos
clases sencillas:
.center_500{
width: 500px;
}
.center_700{
width: 700px;
}
Y segun cargue tu página le coloca la clase que quieras, tambien
puedes aplicarle un display: none; a right o eliminarlo
definitivamente en la página donde no necesites mostralo
Saludo,
DJ-Dom
El 25/07/06, DJ-Dom[EMAIL PROTECTED] escribió:
Hola Javier...
Has una prueba:
padding: 0 0 0 200px; /* right visible */
padding: 0 0 0 0; /* right no visible */
Saludo,
DJ-Dom
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
Dioss, tal como está el código que te mandé si le pongo
padding: 0 0 0 200px;
No funciona te ruego, te suplico, te imploro que si lo has
conseguido me pases el codigo
Gracias por el interés
DJ-Dom escribió:
Hola Javier,
Prueba a aplicarle a center
padding: 0 0 0 ANCHO_DE_LEFTpx;
Saludo,
DJ-Dom
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
He creado un ejemplo sencillo en local porque no tengo url que pasaros
He puesto dos ejemplos, uno con el div right y otro sin él.
Lo que quiero conseguir es que el div center se estire en el segundo
caso ocupando el espacio dejado por right
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html; charset=iso-8859-1
/
titlePrueba de DIV CENTRAL fluido/title
style
#contenedor {
position: relative;
width: 900px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
background-color: #CC;
}
#left {
float: left;
width: 200px;
background-color: #99;
}
#center {
float: left;
min-width: 500px;
max-width: 700px;
width: auto !important;
background-color: #006600;
}
#right {
float:right;
width: 200px;
background-color: #99;
}
/style
/head
body
!-- Prueba de poner un layout de 3 columnas donde la del medio es
fluida para que en el caso de que la derecha desaparezca, la central se
estire para ocupar su lugar --
div id=contenedor
div id=leftnbsp;/div
div id=centernbsp;/div
div id=rightnbsp;/div
div style=clear:both/div
/div
br /br /
div id=contenedor
div id=leftnbsp;/div
div id=centernbsp;/div
div style=clear:both/div
/div
/body
/html
Hugo A. Valencia escribió:
Hola Javier,
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
Estoy diseñando un site de 3 columnas.
La izquierda y central con float:left y la derecha con float:right.
El izquierdo y derecho miden 200px y el central 500px (el ancho total
es
de 900px).
El problema viene porque quiero a veces mostrar y ocultar la columna de
la derecha, pero claro y lógico, la columna central no se escala porque
tiene un tamaño fijo de 500px.
Queria saber si es posible maquetar esto de las 3 columnas, pero de
forma que al ocultar la columna de la derecha, el central se me estire
y
pase a medir 700px.
podrías mandar la dirección donde estás probando la página,
o en su defecto, copiar-pegar el código HTML y la hoja
de estilos que estás usando.
Creo que te podríamos dar una respuesta más apropiada.
Gracias desde ya.
___
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://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://ovillo.org/mailman/listinfo/ovillo
--
www.dj-dom.net
[EMAIL PROTECTED]
--
www.dj-dom.net
[EMAIL PROTECTED]
___
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://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Diseño de 3 columnas
Hi again Dj Dom:
Cuando aparece o no aparece el right no lo puedo controlar porque es
un site muy grande, generado por programación, etc... un lio dificil de
explicar. Pero ten en cuenta que cuando el right no aparece es porque
no se construye, no porque tenga un display:none. Por eso os puse los
dos casos en en ejemplo.
Tenemos que suponer no puedo saber cuando va a salir el right o cuando
no lo va a hacer, así que tengo que hacer un center que en el primer
caso mida 500px y en el segundo 700px. Pensabe que de alguna manera se
podian usar porcentajes, pero ya estoy que me ahorco porque no lo consigo.
Vamos, que tengo que conseguir un resultado u otro con unas solas
propiedades para el center.
Gracias por tu paciencia
DJ-Dom escribió:
Hola Javier dime algo, como piensas cambiar el tamaño de central?
Porque si lo que quieres es llevarla de 500px a 700px puedes hacer dos
clases sencillas:
.center_500{
width: 500px;
}
.center_700{
width: 700px;
}
Y segun cargue tu página le coloca la clase que quieras, tambien
puedes aplicarle un display: none; a right o eliminarlo
definitivamente en la página donde no necesites mostralo
Saludo,
DJ-Dom
El 25/07/06, DJ-Dom[EMAIL PROTECTED] escribió:
Hola Javier...
Has una prueba:
padding: 0 0 0 200px; /* right visible */
padding: 0 0 0 0; /* right no visible */
Saludo,
DJ-Dom
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
Dioss, tal como está el código que te mandé si le pongo
padding: 0 0 0 200px;
No funciona te ruego, te suplico, te imploro que si lo has
conseguido me pases el codigo
Gracias por el interés
DJ-Dom escribió:
Hola Javier,
Prueba a aplicarle a center
padding: 0 0 0 ANCHO_DE_LEFTpx;
Saludo,
DJ-Dom
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
He creado un ejemplo sencillo en local porque no tengo url que pasaros
He puesto dos ejemplos, uno con el div right y otro sin él.
Lo que quiero conseguir es que el div center se estire en el segundo
caso ocupando el espacio dejado por right
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html; charset=iso-8859-1 /
titlePrueba de DIV CENTRAL fluido/title
style
#contenedor {
position: relative;
width: 900px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
background-color: #CC;
}
#left {
float: left;
width: 200px;
background-color: #99;
}
#center {
float: left;
min-width: 500px;
max-width: 700px;
width: auto !important;
background-color: #006600;
}
#right {
float:right;
width: 200px;
background-color: #99;
}
/style
/head
body
!-- Prueba de poner un layout de 3 columnas donde la del medio es
fluida para que en el caso de que la derecha desaparezca, la central se
estire para ocupar su lugar --
div id=contenedor
div id=leftnbsp;/div
div id=centernbsp;/div
div id=rightnbsp;/div
div style=clear:both/div
/div
br /br /
div id=contenedor
div id=leftnbsp;/div
div id=centernbsp;/div
div style=clear:both/div
/div
/body
/html
Hugo A. Valencia escribió:
Hola Javier,
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
Estoy diseñando un site de 3 columnas.
La izquierda y central con float:left y la derecha con float:right.
El izquierdo y derecho miden 200px y el central 500px (el ancho total es
de 900px).
El problema viene porque quiero a veces mostrar y ocultar la columna de
la derecha, pero claro y lógico, la columna central no se escala porque
tiene un tamaño fijo de 500px.
Queria saber si es posible maquetar esto de las 3 columnas, pero de
forma que al ocultar la columna de la derecha, el central se me estire y
pase a medir 700px.
podrías mandar la dirección donde estás probando la página,
o en su defecto, copiar-pegar el código HTML y la hoja
de estilos que estás usando.
Creo que te podríamos dar una respuesta más apropiada.
Gracias desde ya.
___
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://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://ovillo.org/mailman/listinfo/ovillo
--
www.dj-dom.net
[EMAIL PROTECTED]
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes
Re: [Ovillo] Diseño de 3 columnas
Te puedo poner como un ejemplo de cuando ocurre algo similar aunque no
tenga mucho que ver
Si tu tienes un párrafo de texto estirado al 100% del navegador e
introduces en él una imagen con float:left... el texto se encoje para
dejar sitio a la imagen ¿verdad?
Y si borramos la imagen, el texto se vuelve a estirar.
Algo parecido es lo que quiero pero con la estructura del ejemplo que os
mandé
DJ-Dom escribió:
Hola Javier dime algo, como piensas cambiar el tamaño de central?
Porque si lo que quieres es llevarla de 500px a 700px puedes hacer dos
clases sencillas:
.center_500{
width: 500px;
}
.center_700{
width: 700px;
}
Y segun cargue tu página le coloca la clase que quieras, tambien
puedes aplicarle un display: none; a right o eliminarlo
definitivamente en la página donde no necesites mostralo
Saludo,
DJ-Dom
El 25/07/06, DJ-Dom[EMAIL PROTECTED] escribió:
Hola Javier...
Has una prueba:
padding: 0 0 0 200px; /* right visible */
padding: 0 0 0 0; /* right no visible */
Saludo,
DJ-Dom
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
Dioss, tal como está el código que te mandé si le pongo
padding: 0 0 0 200px;
No funciona te ruego, te suplico, te imploro que si lo has
conseguido me pases el codigo
Gracias por el interés
DJ-Dom escribió:
Hola Javier,
Prueba a aplicarle a center
padding: 0 0 0 ANCHO_DE_LEFTpx;
Saludo,
DJ-Dom
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
He creado un ejemplo sencillo en local porque no tengo url que pasaros
He puesto dos ejemplos, uno con el div right y otro sin él.
Lo que quiero conseguir es que el div center se estire en el segundo
caso ocupando el espacio dejado por right
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html; charset=iso-8859-1 /
titlePrueba de DIV CENTRAL fluido/title
style
#contenedor {
position: relative;
width: 900px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
background-color: #CC;
}
#left {
float: left;
width: 200px;
background-color: #99;
}
#center {
float: left;
min-width: 500px;
max-width: 700px;
width: auto !important;
background-color: #006600;
}
#right {
float:right;
width: 200px;
background-color: #99;
}
/style
/head
body
!-- Prueba de poner un layout de 3 columnas donde la del medio es
fluida para que en el caso de que la derecha desaparezca, la central se
estire para ocupar su lugar --
div id=contenedor
div id=leftnbsp;/div
div id=centernbsp;/div
div id=rightnbsp;/div
div style=clear:both/div
/div
br /br /
div id=contenedor
div id=leftnbsp;/div
div id=centernbsp;/div
div style=clear:both/div
/div
/body
/html
Hugo A. Valencia escribió:
Hola Javier,
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
Estoy diseñando un site de 3 columnas.
La izquierda y central con float:left y la derecha con float:right.
El izquierdo y derecho miden 200px y el central 500px (el ancho total es
de 900px).
El problema viene porque quiero a veces mostrar y ocultar la columna de
la derecha, pero claro y lógico, la columna central no se escala porque
tiene un tamaño fijo de 500px.
Queria saber si es posible maquetar esto de las 3 columnas, pero de
forma que al ocultar la columna de la derecha, el central se me estire y
pase a medir 700px.
podrías mandar la dirección donde estás probando la página,
o en su defecto, copiar-pegar el código HTML y la hoja
de estilos que estás usando.
Creo que te podríamos dar una respuesta más apropiada.
Gracias desde ya.
___
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://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://ovillo.org/mailman/listinfo/ovillo
--
www.dj-dom.net
[EMAIL PROTECTED]
___
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://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Diseño de 3 columnas
Es que no sabes cuando va a aparece o no tu right, pero algún evento
hace que aparezaca o desaparesca, si es por parametros de urls puedes
usar condicionales del lenguaje que uses para aplicar una u otra
clase, si el efecto de esconder el right es con javascript pues lo
haces con este mismo lenguaje para cambiar la clase
Creo que eso depende más del evento que ha de provocar la visibilidad
de la colunma right o la esconda
Un tonto ejemplo:
http://www.dj-dom.net/web/
Tambien puedes ver que en mi sitio al darle a leer más hace lo que
quieres. (Pero lo hace aplicando clases con condicionales PHP).
Saludo,
DJ-Dom
2006/7/25, Juan Dárien [EMAIL PROTECTED]:
la plantilla CITRUS de wordpress no tiene menu de navegacion a los
costados cuando estas en la pagina principal, pero cuando entras en
algun post o pagina estatica un menu a la derecha aparece (llamado
por el get_sidebar) quizas deverias pensar en hacer dos paginas
diferentes..
osea un index con los dos menus (izquierdo y derecho) y otra solo
con el menu izquierdo y con el famoso ancho de 700px. que se llame por
ejemplo pagina (html o php).
serviria mucho mas si s`piesemos si estas usando php o html y en que
casos especificos el menu de la derecha va a desaparecer. (si al
entrar en alguna nota o en que momento)
saludos... juandarien
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
Te puedo poner como un ejemplo de cuando ocurre algo similar aunque no
tenga mucho que ver
Si tu tienes un párrafo de texto estirado al 100% del navegador e
introduces en él una imagen con float:left... el texto se encoje para
dejar sitio a la imagen ¿verdad?
Y si borramos la imagen, el texto se vuelve a estirar.
Algo parecido es lo que quiero pero con la estructura del ejemplo que os
mandé
DJ-Dom escribió:
Hola Javier dime algo, como piensas cambiar el tamaño de central?
Porque si lo que quieres es llevarla de 500px a 700px puedes hacer dos
clases sencillas:
.center_500{
width: 500px;
}
.center_700{
width: 700px;
}
Y segun cargue tu página le coloca la clase que quieras, tambien
puedes aplicarle un display: none; a right o eliminarlo
definitivamente en la página donde no necesites mostralo
Saludo,
DJ-Dom
El 25/07/06, DJ-Dom[EMAIL PROTECTED] escribió:
Hola Javier...
Has una prueba:
padding: 0 0 0 200px; /* right visible */
padding: 0 0 0 0; /* right no visible */
Saludo,
DJ-Dom
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
Dioss, tal como está el código que te mandé si le pongo
padding: 0 0 0 200px;
No funciona te ruego, te suplico, te imploro que si lo has
conseguido me pases el codigo
Gracias por el interés
DJ-Dom escribió:
Hola Javier,
Prueba a aplicarle a center
padding: 0 0 0 ANCHO_DE_LEFTpx;
Saludo,
DJ-Dom
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
He creado un ejemplo sencillo en local porque no tengo url que pasaros
He puesto dos ejemplos, uno con el div right y otro sin él.
Lo que quiero conseguir es que el div center se estire en el segundo
caso ocupando el espacio dejado por right
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html;
charset=iso-8859-1 /
titlePrueba de DIV CENTRAL fluido/title
style
#contenedor {
position: relative;
width: 900px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
background-color: #CC;
}
#left {
float: left;
width: 200px;
background-color: #99;
}
#center {
float: left;
min-width: 500px;
max-width: 700px;
width: auto !important;
background-color: #006600;
}
#right {
float:right;
width: 200px;
background-color: #99;
}
/style
/head
body
!-- Prueba de poner un layout de 3 columnas donde la del medio es
fluida para que en el caso de que la derecha desaparezca, la central
se
estire para ocupar su lugar --
div id=contenedor
div id=leftnbsp;/div
div id=centernbsp;/div
div id=rightnbsp;/div
div style=clear:both/div
/div
br /br /
div id=contenedor
div id=leftnbsp;/div
div id=centernbsp;/div
div style=clear:both/div
/div
/body
/html
Hugo A. Valencia escribió:
Hola Javier,
El 25/07/06, Javier Prieto[EMAIL PROTECTED] escribió:
Estoy diseñando un site de 3 columnas.
La izquierda y central con float:left y la derecha con float:right.
El izquierdo y derecho miden 200px y el central 500px (el ancho
total es
de 900px).
El problema viene porque quiero a veces mostrar y
