Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Uma constatação que fiz hoje: por mais que seja possível determinar no css que uma linha tenha menos que 1px, os navegadores não são capazes de renderizá-la corretamente.
Fiz o seguinte teste: uma div com uma linha de 0.5px em cima uma de 1px embaixo.
.box{
border-top:solid 0.5px #000;
border-bottom:solid 1px #000;
width:200px;
height:25px;
position:absolute;
left:300px;
top:300px;
}
Resultado:
Chrome/Safari: em zoom 100%, a linha de cima fica invisível. Se aumentar o zoom, ela pode ser vista e está mais fina que a linha de baixo.
Firefox: em zoom 100%, as duas linhas podem ser vistas, mas têm praticamente a mesma espessura. Ou seja: ele desconsidera o valor abaixo de 1px. Se aumentar o zoom, pode se perceber a difrença de espessura.
Explorer 9: em zoom 100%, a linha de cima perde um pouco da nitidez, apresentando uma linha em um tom mais claro sobre a linha principal. Se aumentar o zoom, pode se perceber a difrença de espessura.
Explorer 8 (via IE Tester): em zoom 100%, as duas linhas têm a mesma espessura.
Opera: com o sem zoom, a linha de cima fica invisível.
Carregando comentários...