In Sub-Pixel Problem in CSS, John Resig, l'autore di jQuery si è chiesto semplicemente: come vengono arrotondate le larghezze percentuali quando il loro risultato non è intero?
La base di partenza è questo test
in cui in un div largo 50 pixel vengono inseriti quattro elementi float larghi il
25%. Cià fa sì che ciascuno dovrebbe misurare in via teorica 12.5 pixel. Cosa impossibile, dato che i pixel sono ad oggi un'unità non scindibile.
La conclusione è a parer mio un po' attesa: ovvero che i browser trattano gli
arrotondamenti in maniera differente. Internet Explorer 6 e 7 arrotondano all'intero
superiore (13), Opera e Safari a quello inferiore (12) e Firefox arrotonda
alcuni elementi a 12px e altri a 13px.
Un piccolo insegnamento che si può trarre, per chi non ne fosse a conoscenza: quando si usano le percentuali su elementi float è bene fare in modo che le loro somma sia leggermente inferiore al 100% netto così da evitare che gli arrotondamenti causino problemi di layout.
