Re: [Ovillo] comportamiento de span e imagen flotada
muchas gracias strip la verdad que con lo que me dices y lo que pone ahí, ejemplos y todo lo veo mas claro. Si al flotarlo pasa a ser inline y antes tiene un elemento inline, se ponen en la misma fila, claro y como está flotada a la izquierda pues izquierda. apunto :) gracias El 27/04/2010, a las 21:58, stripTM escribió: Martin Etxauri escribió: Hola a todos Me he topado con un comportamiento que ha cambiado de FF2 a FF3 que no acabo de entender (y eso que también se ve igual que en FF3 en Safari y Opera (aunque Opera parece cambiar según el contexto que no acabo de pillar). El caso esquematizado es el siguiente: spantexto/span img src=imagen.jpg style=float:left; / En FF2 el span está siempre por encima de la imagen alineado a la izquierda (por defecto). En FF3 la imagen se coloca a la izquierda y el span se queda pegado a la derecha de la imagen y a la misma altura. Está claro que el span es un elemento de linea y si esto fuera al revés, que el span está debajo de la imagen, entiendo que sin flotarlo pase a la derecha de la imagen porque el float de la imagen la convierte en un elemento de linea. Lo que me sorprende es que al estar por encima de la imagen, la imagen se le cuele. Y pasa algo que a mi me parece curioso cuando metes un texto largo en el span: si vas cambiando el tamaño de la ventana (o extensión del texto) la imagen se colará solo a la última linea de texto (quedando pegada a la penúltima y con la última a su derecha) y solo siempre y cuando la última linea sea mas corta que el ancho de la ventana, claro. Bueno, y pasa lo mismo si en vez de poner un span pones simplemente un texto No acabo de entender muy bien porque pasa esto y no he logrado aclararlo en internet ¿alguien entiende porque pasa esto? Al margen de parecer mas o menos lógico quisiera saber en base a que pasa. Aquí tienes el bug donde lo corrigieron. https://bugzilla.mozilla.org/show_bug.cgi?id=50630 Cuando flotas un elemento que está junto a un elemento inline la especificación dice que debe colocarse a la altura de la última caja que genera el 'inline', en este caso al flotar la imagen a la izquierda la coloca justo antes de la última línea. -- Saludos -=stripTM=- ___ 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] comportamiento de span e imagen flotada
El 28 de abril de 2010 09:14, Martin Etxauri escribió: muchas gracias strip la verdad que con lo que me dices y lo que pone ahí, ejemplos y todo lo veo mas claro. Si al flotarlo pasa a ser inline y antes tiene un elemento inline, se ponen en la misma fila, claro y como está flotada a la izquierda pues izquierda. apunto :) En eso te estás liando un poco. El elemento img es un elemento en línea; al flotar un elemento, éste pasa a ser de bloque. Respecto al comportamiento en este caso es como dice stripTM, creo que es esta frase donde se define este tema: The outer tophttp://www.w3.org/TR/CSS21/box.html#outer-edgeof an element's floating box may not be higher than the top of any line-box http://www.w3.org/TR/CSS21/visuren.html#line-box containing a box generated by an element earlier in the source document. Mi inglés no es muy bueno y la traducción del sidar aún la entiendo menos; stripTM lo ha explicado mucho mejor. ___ 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] comportamiento de span e imagen flotada
En eso te estás liando un poco. El elemento img es un elemento en línea; al flotar un elemento, éste pasa a ser de bloque. sisi, tienes razón, me estaba liando.. mas al decirlo que al pensarlo :P ___ 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] comportamiento de span e imagen flotada
Hola a todos Me he topado con un comportamiento que ha cambiado de FF2 a FF3 que no acabo de entender (y eso que también se ve igual que en FF3 en Safari y Opera (aunque Opera parece cambiar según el contexto que no acabo de pillar). El caso esquematizado es el siguiente: spantexto/span img src=imagen.jpg style=float:left; / En FF2 el span está siempre por encima de la imagen alineado a la izquierda (por defecto). En FF3 la imagen se coloca a la izquierda y el span se queda pegado a la derecha de la imagen y a la misma altura. Está claro que el span es un elemento de linea y si esto fuera al revés, que el span está debajo de la imagen, entiendo que sin flotarlo pase a la derecha de la imagen porque el float de la imagen la convierte en un elemento de linea. Lo que me sorprende es que al estar por encima de la imagen, la imagen se le cuele. Y pasa algo que a mi me parece curioso cuando metes un texto largo en el span: si vas cambiando el tamaño de la ventana (o extensión del texto) la imagen se colará solo a la última linea de texto (quedando pegada a la penúltima y con la última a su derecha) y solo siempre y cuando la última linea sea mas corta que el ancho de la ventana, claro. Bueno, y pasa lo mismo si en vez de poner un span pones simplemente un texto No acabo de entender muy bien porque pasa esto y no he logrado aclararlo en internet ¿alguien entiende porque pasa esto? Al margen de parecer mas o menos lógico quisiera saber en base a que pasa. Gracias a todos por adelantado Martin p.d.: en al caso práctico lo he arreglado poniéndole display: block; al span, pero me tiene mosca. ___ 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
