17SepMargen Doble en Internet Explorer

Para programadores: En un diseño con dos flotantes posicionados a izquierda y derecha formando dos columnas me encuentro con que Explorer 6.0 genera un margen izquierdo del doble tamaño que Firefox y Explorer 7.0. La explicación se debe a este “postulado”:

"En Explorer 6.0 cuando un margen se aplica a una caja flotante en la misma dirección que el flotante ese margen se duplica en tamaño."

Vamos a dar dos soluciones al problema: una solución viene a modo de hack. Un hack para una hoja de estilo en cascada o css, es una norma que altera el comportamiento de un navegador sin afectar a otros. Generalmente fruto de un comportamiento deficiente que se sale del estándar. Lo que va a hacer nuestro hack es que en explorer 6.0 el flotante en cuestión funcione de forma diferente comportándose como un elemento en línea. Mediante esta regla definimos un comportamiento que sólo explorer 6 reconoce:

  1.  
  2. *html .column{
  3.         .display: inline;
  4. }
  5.  

La otra solución es aplicarle un padding al elemento contenedor para ahorrarse problemas con ese margen. Más sencillo aún que tener que añadir el hack.

Se trata de un error que podéis encontrar documentado en esta página, y que yo resumo mediante esta imagen para que se entienda con claridad:

dobleMargen IE explorer

 


Blogroll

Recent Listening