2012-09-27 19 views
6

http://jsfiddle.net/3BFGU/71/El ancho del elemento html es menor que la suma del ancho de los elementos secundarios individuales?

anchura del elemento html padre (calculado utilizando 1 $ (el) .Width (1)) es menor que la anchura combinada de elementos secundarios.

  1. Se produce solo en Firefox.

¿Alguna idea de por qué esto podría estar pasando?

+0

¿Qué versión de firefox? No pasa en 15 para mí. –

+0

estoy usando 15.0.1.También sucede con la versión Nightly de FF (versión 17) – sbr

Respuesta

4

Probablemente, la anchura total es una suma de anchuras y estos anchuras fraccionarias fueron previamente redondeado de alguna manera. Esta suma no es igual al ancho del contenedor. Descubrí que más elementos producen más imprecisión, p. 3 píxeles de diferencia para 5 elementos.

actualy, bloque de texto en línea puede tener fraccional anchura, por ejemplo 10.6px. Entonces, tres de esos bloques colocados en una fila tomarán 31.8px ≈ 32px. Pero cuando cada ancho se redondeaba a ≈ 11px * 3 = 33px en total. Aquí está la deferencia de un píxel. http://jsfiddle.net/3BFGU/86/

n.b. El motor de renderizado de fuente de Firefox comienza a usar colocación de letra subpixel solo cuando font-size> 15px (para al menos Verdana, Arial y Segoe UI, que tienen una indirecta extrema aplicada). Cuando menos cada letra tiene un valor de ancho entero y todas las mismas letras en la cadena tienen exactamente la misma imagen ráster. Este behaivior ve claramente con letter-spacing: .9px; y el cambio entre font-size: 14.9px; y font-size: 15.1px;

Además de eso, hace un año hice a little playground para probar motores de renderizado de los diferentes navegadores.

+0

Gracias. Si pudieras detallar que el bloque de texto en línea puede tener un ancho fraccionario, eso será genial. – sbr

2

Parece un error en Firefox .... ¿posiblemente un error de redondeo?

El error no es coherente. Si agrega un espacio dentro del segundo tramo, después de 'nuevo', entonces se calcula correctamente (estoy probando en 14.0.1).

http://jsfiddle.net/DigitalBiscuits/3BFGU/81/

Además, si se cambia la última 'w' a una capital de nuevo, se calcula correctamente. http://jsfiddle.net/DigitalBiscuits/3BFGU/83/

Esto me llevaría a pensar que Firefox está calculando el tamaño de los elementos en píxeles, y debe haber algún redondeo, hacia arriba o hacia abajo, que esté causando esta discrepancia.

~ ~ Editar

Acabo de actualizar a 15,0 y estoy consiguiendo los mismos resultados. Probaré todas las versiones hasta que esté completamente actualizado y le dejaré saber los resultados.

mismo otra vez en 15.0.1, la última versión

0

El ancho exacto se está redondeando en el momento del cálculo. Eso posiblemente podría estar causando que ff muestre ese resultado.

Cuestiones relacionadas