Matemática do IE

Bom, enquanto não acho meu tom por aqui, postarei sobre o IE, o amigo dos desenvolvedores web.

A algum tempo me deparei com um bug comportamento curioso do nosso browser predileto. Seguindo meu guia de boas práticas de CSS, construí a estrutura básica do site sem usar paddings e margins, somente larguras com porcentagens complementares. Essa prática sozinha já evita várias dores de cabeça. Mas nem tudo são flores...

Ao fazer um layout de duas colunas, por exemplo, poderíamos atribuir as larguras 30% e 70% e esperar que tudo funcionasse na mais perfeita paz, e é nesse momento que nós vemos a beleza do IE: 30% + 70% > 100%. Isso acontece quando a conta termina com .5, o IE arredonda os dois valores pra cima, quebrando o layout.

Ex.: body = 775px → 232.5 + 542.5 = 233 + 543 então 776 > 775

Mas não se desespere, isso é bem simples de resolver, basta acrescentar (ou diminuir) 1px a largura. No exemplo, ficaria 776px. De qualquer forma, aí em baixo tem o link para o código, se sobrar alguma dúvida (pouco provável) ou se tiver alguma sugestão, grita aqui.

obs.: Neste post, IE = IE7. Aquele outro é palavrão.