Luan Garcia » xhtml, css, jquery e webstandards

Um milagre galera!!! Dois posts no mesmo dia!

É o seguinte,há um tempo atrás me deparei com um bug muito chato do ie6 e que suei pra descobrir como resolver, então vale apena a dica.

Muitas vezes nós não entendemos alguns bugs do ie6 mas mesmo assim estamos la firmes e fortes. Alguem por acaso ja se deparou com o bug de duplicar a última letra? Pois bem, se já aconteceu isso com você, agora não vais mais acontecer.

Uma tendência dos desenvolvedores mais organizados, é comentar algumas partes do seu código afim de não se perder e deixá-lo mais intuitivo. Porém, alguns desenvolvedores abusam um pouco dos comentários (não que não possa, mas eu adoto a seguinte postura para meus sites: coloco comentários apenas nos pontos mais importantes, ou seja, na maioria dos casos, no fechamento das tags mais importantes de estruturação) e esse abuso causa este bug.

Pelo menos comigo, todas as vezes que tive esse problema, consegui resolver tirando o excesso de comentários que estavam a volta do elemento com esse problema.

Então é isso galera, é um bug bem simples de evitar mas que com certeza já deu dor de cabeça a muitos desenvolvedores.

Se alguém tiver outra solução acho interessante postar, pois eu mesmo desconheço

Abs!

Como sabemos, o IE6 é composto por dezenas de bugs chatos e incovenientes.

E é sobre um deles que vamos falar agora: em elementos com float, se dermos uma margem para a direita ou esquerda, o IE6 tem mania de duplicar essa margem.

Normalmente os(alguns) desenvolvedores falam: “Ah mas resolver isso é facil, é so colocar um hack pro ie6 dizendo que ele tem metade da margem que estao nos outros.”

Sim claro, isso é óbvio, mas que tal resolvermos isso sem hack?

Então faremos o seguinte:

- No elemento que possui o float e a margem, se ocorrer do ie6 duplicar essa margem, use o display: inline; que este bug irá ser corrigido automaticamente.

Ex.:

elemento {
width: 300px;
float: left;
margin-right: 50px; /*essa margem dobra no ie6, logo fica com 100px*/
display: inline; /*corrige o erro da margem duplicada*/}

Valeu galera, até a próxima