Web-kit e valores de sub-pixel, solução alternativa?
Notei que navegadores de kit da Web como Chrome e Safari (Windows) tendem a arredondar os valores para o pixel mais próximo, enquanto o Firefox, IE,? Opera? pode usar valores de sub-pixel. Normalmente, esse não é um grande problema, mas quando os uso para alinhar precisamente o espaçamento entre letras ou usar sombras de texto para obter efeitos consistentes em diferentes resoluções de clientes, isso me causa dor de cabeça. Veja o seguinte caso de teste.
Você verá que, no FF, mesmo as letras mais pequenas ainda têm sombra, enquanto o Chrome arredonda o valor em para zero e os dois primeiros parágrafos não têm sombr
EDITA Não se trata das unidades. Se você substituir 0,03em por 0,9, 0,8, 0,7 .. px O FF exibirá sombras cada vez menores, enquanto que quando o Chrome estiver abaixo de 1px, de repente, nada será exibid
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="bg" xml:lang="bg" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type="text/css">body {font-size: 18px;} p {color: cyan; text-shadow: -0.03em -0.03em 0 rgb(0, 0, 0);}</style>
</head>
<body>
<p style="font-size:1em">No Shadow Test</p>
<p style="font-size:1.5em">No Shadow Test</p>
<p style="font-size:2em">Test</p>
<p style="font-size:2.5em">Test</p>
<p style="font-size:3em">Test</p>
<p style="font-size:3.5em">Test</p>
<p style="font-size:4em">Test</p>
<p style="font-size:4.5em">Test</p>
<p style="font-size:5em">Test</p>
</body>
</html>