Re: [Ovillo] Problemas con float
Santos, el problema está en el div id=imagen que contiene al a que a su vez contiene a la imagen en sí. Tiene como propiedad overflow:hidden, que hace que todo el div tome la altura de su contenido, y al tener ancho de 100%, empuja al resto del texto hacia abajo. Quitando el overflow:hidden se ve como creo que quieres conseguirlo, al menos en Firefox (no he chequeado en otros navegadores). Un saludo, – *Pablo Rodríguez Molinari* Front-End Developer www.niceslice.com.ar 2009/10/19 santosvz santo...@graficssvz.com Me disculpan pero no consigo dar con el crucigrama que no me permite situar una imagen en float:left. Algo está afectando que impide el float, pero no consigo localizarlo. Muchos ojos, ven más que dos. Les dejo un enlace de cómo se ve en todos los navegadores, asi que no es un problema de navegador: http://tinyurl.com/yzo484t La idea es que la imagen quede float:left y el texto a la derecha. Subí el contenido a un servidor de prueba para que puedan analizar el contexto general, ya que no es muy simple: http://santosvz.vndv.com/kde/guia_kde.htm Agradezco cualquier comentario. Un cordial saludo y que tengan un feliz dia. SantosVZ ___ 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
[Ovillo] Problemas con float
Me disculpan pero no consigo dar con el crucigrama que no me permite situar una imagen en float:left. Algo está afectando que impide el float, pero no consigo localizarlo. Muchos ojos, ven más que dos. Les dejo un enlace de cómo se ve en todos los navegadores, asi que no es un problema de navegador: http://tinyurl.com/yzo484t La idea es que la imagen quede float:left y el texto a la derecha. Subí el contenido a un servidor de prueba para que puedan analizar el contexto general, ya que no es muy simple: http://santosvz.vndv.com/kde/guia_kde.htm Agradezco cualquier comentario. Un cordial saludo y que tengan un feliz dia. SantosVZ ___ 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] Problemas con float/clear
Si no pones overflow: auto, no se verá bien en ningún navegador sobre osx (mac). Probado en firefox, mozilla, y safari... Thanks, los problemas de no tener un mac a mano para probar ;-) ___ 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] Problemas con float/clear
Hola a todos. Os cuento el problema a ver si me podeis echar un cable. Se trata que cuando haces un clear, este afecta no al elemento que flota en la capa contendora sino que afecta a otros elementos anteriores que estuvieran flotando. Os pongo mejor un ejemplo: http://www.rebollosablon.es/pruebas/columnas.htm Al tener una maquetación a 3 columnas con la col izquierda con float left, si en la columna central tengo un contenido que también lleva un float left y quiero luego introducir un clear, este clear me afecta no sólo al contedido de la columna central si no que me afecta a la columna izquierda. En el ejemplo se ve claro. ¿Hay alguna manera de restringir el clear a su elemento con float mas próximo?? Saludos y gracias. Juan Rebollo Hola Sí esa es una cagadilla del clear que a veces me vuelve loca. En el caso que presentas, lo más sencillo parece meter cada contenido que flota en un div al que asignas overflow: auto; Así te olvidas de clears, los contenidos quedan bien colocados, y además puedes ajustar con facilidad la distancia entre ellos utilizando márgenes. Suerte Eva ___ 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] Problemas con float/clear
Hola te inserto aqui tu codigo una vez solventado el tema. Espero que fuera lo que quieres conseguir. Te he resaltado en negrita los cambios he sacado el hr de los divs y he creado un estilo para las cajas !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 / titleProblema float/title style type=text/css !-- * { margin: 0; padding: 0; } body { font: 14px normal tahoma; text-align: center; } div#c1 { margin: 0; border: 1px solid red; padding: 0; height: 400px; width: 150px; float: left; } div#c3 { margin: 0; border: 1px solid red; padding: 0; height: 400px; width: 150px; float: right; } div#c2 { margin: 0 154px 0 154px; border: 1px solid green; padding: 0 8px; text-align: left; width:auto; height:auto; } .flota { width: 130px; height: 110px; color: #fff; background: #000; float: left; } hr { } #caja {width:auto; height:100%; margin-bottom:5px;} -- /style /head body div id=c1 pColumna Izquierdabr / (float left)/p /div div id=c3 pColumna Derechabr / (float right) /p /div div id=c2 h2Columna Central/h2 div id=caja p class=flotaContenido que flota/p pUn texto bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla/p /div hr / div id=caja p class=flotaOtro que flota/p pEl lt;hrgt; justo encima y todo este texto deberían estar justo debajo de la caja negra al lado de Un texto bla bla bla... pero como el lt;hrgt; superior tiene un clear left, quot;limpiaquot; tanto el float de la caja negra como el de la columna izquierda./p hr / /div /div /body /html - 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] Problemas con float/clear
body div id=c1 pColumna Izquierdabr / (float left)/p /div div id=c3 pColumna Derechabr / (float right) /p /div div id=c2 h2Columna Central/h2 div id=caja p class=flotaContenido que flota/p pUn texto bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla/p /div hr / div id=caja p class=flotaOtro que flota/p pEl lt;hrgt; justo encima y todo este texto deberían estar justo debajo de la caja negra al lado de Un texto bla bla bla... pero como el lt;hrgt; superior tiene un clear left, quot;limpiaquot; tanto el float de la caja negra como el de la columna izquierda./p hr / /div /div /body /html Cuidado, que has puesto div id=caja donde debería poner div class=caja, ya que no puedes tener varios objetos con el mismo id... Lógicamente también hay que cambiar #caja por .caja en las css. El resto no lo he mirado, pero eso me ha cantado... Eva ___ 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] Problemas con float/clear
si es verdad las prisas son malas consejeras gracias eva espero que le sirva, y creo que la posible solución a lo que el queria podria ser esa Eva del Campo [EMAIL PROTECTED] escribió: Columna Izquierda (float left) Columna Derecha (float right) Columna Central Contenido que flota Un texto bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla - Otro que flota El hr justo encima y todo este texto deberían estar justo debajo de la caja negra al lado de Un texto bla bla bla... pero como el hr superior tiene un clear left, limpia tanto el float de la caja negra como el de la columna izquierda. - Cuidado, que has puesto donde debería poner class=caja, ya que no puedes tener varios objetos con el mismo id... Lógicamente también hay que cambiar #caja por .caja en las css. El resto no lo he mirado, pero eso me ha cantado... Eva ___ 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 - 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] Problemas con float/clear
Cojonudo!, con perdon. :-) Encerrando lo que flota en un div y dandole como me comentabas un height:100%; todo ok! Y quitando el clear, claro. Con overflow: auto, no se soluciona en cambio. Gracias de nuevo!! - Original Message - From: nicolas carrera [EMAIL PROTECTED] To: Ovillo, la lista de CSS en castellano ovillo@lists.ovillo.org Sent: Monday, July 10, 2006 1:29 PM Subject: Re: [Ovillo] Problemas con float/clear Hola te inserto aqui tu codigo una vez solventado el tema. Espero que fuera lo que quieres conseguir. Te he resaltado en negrita los cambios he sacado el hr de los divs y he creado un estilo para las cajas !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 / titleProblema float/title style type=text/css !-- * { margin: 0; padding: 0; } body { font: 14px normal tahoma; text-align: center; } div#c1 { margin: 0; border: 1px solid red; padding: 0; height: 400px; width: 150px; float: left; } div#c3 { margin: 0; border: 1px solid red; padding: 0; height: 400px; width: 150px; float: right; } div#c2 { margin: 0 154px 0 154px; border: 1px solid green; padding: 0 8px; text-align: left; width:auto; height:auto; } .flota { width: 130px; height: 110px; color: #fff; background: #000; float: left; } hr { } #caja {width:auto; height:100%; margin-bottom:5px;} -- /style /head body div id=c1 pColumna Izquierdabr / (float left)/p /div div id=c3 pColumna Derechabr / (float right) /p /div div id=c2 h2Columna Central/h2 div id=caja p class=flotaContenido que flota/p pUn texto bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla/p /div hr / div id=caja p class=flotaOtro que flota/p pEl lt;hrgt; justo encima y todo este texto deberían estar justo debajo de la caja negra al lado de Un texto bla bla bla... pero como el lt;hrgt; superior tiene un clear left, quot;limpiaquot; tanto el float de la caja negra como el de la columna izquierda./p hr / /div /div /body /html ___ 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] Problemas con float/clear
¡ Me alegro ! :D) - 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] Problemas con float/clear
Cojonudo!, con perdon. :-) Encerrando lo que flota en un div y dandole como me comentabas un height:100%; todo ok! Y quitando el clear, claro. Con overflow: auto, no se soluciona en cambio. Si no pones overflow: auto, no se verá bien en ningún navegador sobre osx (mac). Probado en firefox, mozilla, y safari... ___ 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] problemas con float y firefox
On 5/9/06, Raidel - Lairedsys CO [EMAIL PROTECTED] wrote: Hola, ramon y todos los que me puedan ayudar: Hola Raidel este es el link de la pagina http://spraysites.com/modulos/index.htm como veran en firefox, las capas Fotos Texos Cualkier cosa También en Opera, desgraciadamente... se alinean a la segunda de Texos de noticias Lo que me interesa es lograr que se vea como se ve en IE, pero sin cambiar la estructura del codigo html solo a base de CSS este es el codigo que no debo cambiar: div id=contenedor centro div id=centro div class=spacer/div div class=contenido1Texos de noticias/div div class=contenido11Texos de noticias/div div class=contenido2Fotos/div div class=contenido3Texos/div div class=contenido4Cualkier cosa/div div class=spacer/div /div centro /div Ufff. Pues así de un vistazo nos damos cuenta de que el contenedor2 basa su posición, evidentemente, en la del contenedor11 inmediatamente anterior (menos en IE). El caso es que, claro, al hacer un 'clear: left' automáticamente baja su coordenada vertical, desplazando hacia abajo también la de los siguientes elementos, así que puedes probar a eliminar ese 'clear: left' e intentar posicionar ese contenedor11 de alguna otra manera, por ejemplo con márgenes: contenido11 { margin-top: 102px; margin-left: -202px; ... (eliminar el 'clear: left') } Si te fijas he añadido un par de píxeles a los márgenes para contrarrestar la anchura de los bordes de contenedor1. Tenlo en cuenta en la maquetación final. saludos raidel Un saludo, David Merino Ogando. ___ 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] problemas con float y firefox
Hola maikel, la verdad k me has dado la solucion perfecta jejeejejje, nunca se me hubiera ocurrido pocicionar por margenes, es cierto lo k dices encaja perfecto, millon y medio de gracias en cuanto tenga el scrip de mi idea lo posteare para que vean de que va ;) saludos raidel 2006/5/9, Maikel Naigt [EMAIL PROTECTED]: Hola Raidel este es el link de la pagina http://spraysites.com/modulos/index.htm como veran en firefox, las capas Fotos Texos Cualkier cosa También en Opera, desgraciadamente... se alinean a la segunda de Ufff. Pues así de un vistazo nos damos cuenta de que el contenedor2 basa su posición, evidentemente, en la del contenedor11 inmediatamente anterior (menos en IE). El caso es que, claro, al hacer un 'clear: left' automáticamente baja su coordenada vertical, desplazando hacia abajo también la de los siguientes elementos, así que puedes probar a eliminar ese 'clear: left' e intentar posicionar ese contenedor11 de alguna otra manera, por ejemplo con márgenes: contenido11 { margin-top: 102px; margin-left: -202px; ... (eliminar el 'clear: left') } Si te fijas he añadido un par de píxeles a los márgenes para contrarrestar la anchura de los bordes de contenedor1. Tenlo en cuenta en la maquetación final. saludos raidel Un saludo, David Merino Ogando. ___ 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 -- The live is short, enjoy it when you can. La vida es corta disfruta mientra puedas. ___ 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] problemas con float y firefox
Raidel, si no recuerdo mal, ovillo no permite el envío de adjuntos. Sube el ejemplo a algún sitio y danos la url para echarle un vistazo :) saludos -- Ramón demasiado viejo para ser una joven promesa, demasiado joven para ser una vieja gloria, pero aún así trabajando duro para Simplelógica: apariencia, experiencia y comunicación en la web http://simplelogica.net # (+34) 98 522 12 65 http://simplelogica.net/caoticoneutral/ ___ 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] problemas con float y firefox
Hola, ramon y todos los que me puedan ayudar: este es el link de la pagina http://spraysites.com/modulos/index.htm como veran en firefox, las capas Fotos Texos Cualkier cosa se alinean a la segunda de Texos de noticias Lo que me interesa es lograr que se vea como se ve en IE, pero sin cambiar la estructura del codigo html solo a base de CSS este es el codigo que no debo cambiar: div id=contenedor centro div id=centro div class=spacer/div div class=contenido1Texos de noticias/div div class=contenido11Texos de noticias/div div class=contenido2Fotos/div div class=contenido3Texos/div div class=contenido4Cualkier cosa/div div class=spacer/div /div centro /div en fin todo lo que esta dentro de body, no puedo cambiarlo, ya que mi proposito es generar esto dinamicamente en php de diferentes formas. SI los usuarios me navegan en IE todo perfecto, pero en Firefox me ocurre lo que se ve en el ejemplo, cualquier idea podria ser mi solucion asi que agradesco ideas con fundamentos o descabelladas ;) saludos raidel 2006/5/8, Ramon Pravia [EMAIL PROTECTED]: Raidel, si no recuerdo mal, ovillo no permite el envío de adjuntos. Sube el ejemplo a algún sitio y danos la url para echarle un vistazo :) saludos -- Ramón demasiado viejo para ser una joven promesa, demasiado joven para ser una vieja gloria, pero aún así trabajando duro para Simplelógica: apariencia, experiencia y comunicación en la web http://simplelogica.net # (+34) 98 522 12 65 http://simplelogica.net/caoticoneutral/ ___ 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 -- The live is short, enjoy it when you can. La vida es corta disfruta mientra puedas. ___ 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
[Ovillo] problemas con float y firefox
Hola, es la primera vez que escribo aqui asi que me presentare Mi nombre es Raidel y vivo en canada, soy programador web y estoy inventando con el css Aqui les envio mi problema adjunto si lo ven con firefox se ve mal, increible :) pero si lo ven con IE se ve como realmente quiero que salga, no se si es que el error es del IE pero la verdad es que ese error es el que quiero reproducir, ya que como ven, estoy trabajando con capas flotando, pero quiero que en vez de que la primera se quede sola, que las de la derecha suban, exactamente como se ven en IE Me encanta Firefox pero parece que arreglaron el error del IE y me dejaron sin saber como reproducirlo les agradeceria enormemente una solucion para lograr que este htm que les mando se vea en firefox como se ve en IE saludos Raidel -- Live is short, enjoy it while you can. La vida es corta disfruta mientra puedas. ___ 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
[Ovillo] problemas con float y firefox
Hola, es la primera vez que escribo aqui asi que me presentare Mi nombre es Raidel y vivo en canada, soy programador web y estoy inventando con el css Aqui les envio mi problema adjunto si lo ven con firefox se ve mal, increible :) pero si lo ven con IE se ve como realmente quiero que salga, no se si es que el error es del IE pero la verdad es que ese error es el que quiero reproducir, ya que como ven, estoy trabajando con capas flotando, pero quiero que en vez de que la primera se quede sola, que las de la derecha suban, exactamente como se ven en IE Me encanta Firefox pero parece que arreglaron el error del IE y me dejaron sin saber como reproducirlo les agradeceria enormemente una solucion para lograr que este htm que les mando se vea en firefox como se ve en IE saludos Raidel Nota: en el mensage anteriror se me olvido el archivo, mis disculpas -- The live is short, enjoy it when you can. La vida es corta disfruta mientra puedas. ___ 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] problemas con float y firefox
y el ejemplo??? On 5/7/06, Raidel - Lairedsys CO [EMAIL PROTECTED] wrote: Hola, es la primera vez que escribo aqui asi que me presentare Mi nombre es Raidel y vivo en canada, soy programador web y estoy inventando con el css Aqui les envio mi problema adjunto si lo ven con firefox se ve mal, increible :) pero si lo ven con IE se ve como realmente quiero que salga, no se si es que el error es del IE pero la verdad es que ese error es el que quiero reproducir, ya que como ven, estoy trabajando con capas flotando, pero quiero que en vez de que la primera se quede sola, que las de la derecha suban, exactamente como se ven en IE Me encanta Firefox pero parece que arreglaron el error del IE y me dejaron sin saber como reproducirlo les agradeceria enormemente una solucion para lograr que este htm que les mando se vea en firefox como se ve en IE saludos Raidel Nota: en el mensage anteriror se me olvido el archivo, mis disculpas -- The live is short, enjoy it when you can. La vida es corta disfruta mientra puedas. ___ 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 -- Escael Marrero Webmaster http://www.zunzun.cu Miembro del Consejo Gestor de http://www.proyectoweb.org ___ 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