Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Eu estava verificando o site no IE, pq uso Firefox e verifiquei que o resultado só foi similar, depois que eu mudei os valores para inteiro, da margem por exemplo. Se eu digitar 2.5px, parece que não funciona no IE, na versão 8 pelo menos. Acho que considera ou 2 ou 3 ? Alguém confirma isto? Existe um jeito de reverter?
Eu não tinha pensado neste detalhe da dvisião do pixel. Mas acho que o firefox considera 2.5px como tres e o IE como dois
Teste simples:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="[http://www.w3.org/1999/xhtml">](http://www.w3.org/1999/xhtml)
<head>
<script type="text/javascript">
function estilos( el ) alert( getMarginTop( el ) );
}
function getMarginTop( el ) if( window.getComputedStyle )
return document.defaultView.getComputedStyle(el, null).marginTop;
else if( el.currentStyle )
return el.currentStyle['marginTop'];
}
</script>
<style>#cup {
background: #f0f;
height: 50px;
width: 50px;
margin: 0.5px;
border: 0.5px solid #ccc;
}
</style>
</head>
<body>
<div id="cup" onclick="estilos( this );">
Clique aqui
</div><!-- /cup -->
</body>
</html> realmente pelo menos o ie6, não aceita valores quebrados de px explicitamente declarado, ele arredonda para baixo.0.5px vira 0px
veja que a borda nem aparece, e o computedStyle do margin é 0px no ie, e 0.5px no ff ^_^
pelo menos pra mim, não faz muito sentido 2.5px, mas até onde vi, o ff arredonda para cima sim! :lol:
Não estava querendo quebrar a estrutura por alguns pixeizinhos a mais. Mas enfim, só inteiro.
Pixel é a menor unidade de medida para monitores e esta relacionada diretamente com a resolução do mesmo. Se você pudesse dividir a menor unidade de medida, ela não seria a menor ;)
Sugiro que verifique novamente, se o firefox REALMENTE faz, o errado é o firefox. Na dúvida, baixe outros navegadores e tire a conclusão.
Se precisar de valores relativos, utilize em
body { margin: 1px; }
.margemdoisvirgulaquatro { margin: 1.4em } / 1.4 porque somamos com o 1 do body /