Interrupción de línea inesperada de Firefox usando flotadores y desbordamiento oculto
Tengo un div contenedor que contiene dos elementos: un.button y un.box con texto en el interior..button Viene primero y se flota a la derecha..box no tiene flotador [esto es una restricción, no puedo flotar a la izquierda debido a otras estructuras similares que dependen de que no haya flotador]..box tieneoverflow: hidden; Para establecer un nuevo contexto de formato de bloque. Esto permite.box para abarcar "100% hasta" el elemento flotante anterior,.button.
.outer-container Alberga todos estos y se flota a la derecha.
En Chrome (26.0.1410.12 PC beta-m, 25.0.1364.99 Mac), Safari (6.0.2 Mac) e IE8-9, esto actuará de la manera deseada..boxEl texto se mantiene en una línea, y debido a.outer-containerA la derecha del flotador, será exactamente el tamaño que debe ser. En Firefox, sin embargo, el texto se divide en otra línea.
También encuentro un problema similar cuando.button en su lugar, se deja flotar a la izquierda: obtengo el comportamiento deseado en todo excepto en Firefox.
He visto este Firefox 16.0.1 y 19.0 para PC, y 18.0.1 y 19.0 para Mac. ¿Es esto un error?