IE 6 crea un doble margin y padding cuando usamos dicha propiedad en dos divs flotantes que caen al lado del otro.

El problema

En este código IE 6 lo leerá incorrectamente y creará doble margin y padding en nuestro elemento:

#global-column-1  {
 margin:0 0 0 33px; padding:0 20px 0 0; width:255px; float:left;
}
#global-column-2  {
 margin:0 0 30px 30px; width:250px; float:left;
 }
<span id="more-1067"></span>

La solución

La solución sería utilizar comentarios condicionales para que solo puedan ser vistos por IE 6. Este código que vamos a mostrar a continuación es el mismo de antes pero añadiendole el hack para que “* html #global-column-1” solo pueda verse en IE 6. “display:inline” corrige el doble spacing en IE 6. El código resultante para corregir el doble margin y padding sería este:

#global-column-1  {
margin:0 0 0 33px; padding:0 20px 0 0; width:255px; float:left; } * html #global-column-1 { display:inline;
 }
#global-column-2  {
 margin:0 0 30px 30px; width:250px; float:left;
 }

Otro truco más a tener en cuenta contra el navegador rebelde de Microsoft…

Vía | DavidWalsh