Contacta (+34) 622 045 404

Estudio de desarrollo front-end, maquetación web, diseño y programación WordPress freelance.

Fundado por Alberto Fortes, diseñador y maquetador web HTML5 responsive design, front-end developer JavaScript y programador WordPress freelance a medida desde 2006.

Especializados en outsourcing con importantes clientes finales.

Llamando a los hacks de internet explorer: atacando a ie6 e ie7 por separado en la misma hoja de estilos

8 Mayo, 2007

ie hacks

Esto es el colmo, con explorer 7 se solucionó el modelo de caja, el canal alfa de los pngs… pero explorer todavía tiene mucho que fastidiarnos.

En el último trabajo que me han encargado he tenido que distinguir entre las hojas de estilo comunes (mozilla y safari) y los hacks para explorer. El problema surge cuando estos hacks son distintos para ie6 e ie7, creo que ya hablé de esto en otro post, pero me apetece recordarlo.

A partir de ahora a todas las hojas de estilo para explorer las llamaré mediante igual o menor que 7:

<!--[if lte IE 7]>
<link rel="stylesheet" href="css/ie_style.css" type="text/css" />
<![endif]-->

Una vez dentro de esta, la mejor manera de distinguir entre ie7 e ie6 es el uso del asterisco: * html. Internet Explorer 7 se comporta en este sentido como mozilla y safari e ignora toda línea precedida de * html, no así las versiones anteriores de Explorer, un poco más tontas. Así:


body {
 background:#ccc;
}
∗ html body {
 background:#f00;
}

En ie6 mostrará el color de fondo rojo y en ie7 gris.

La mejor opción para poder validar tus CSS (lo de menos en algunos casos), separar las cosas bien hechas de las mal hechas (hoja de hacks), poder decidir a que versión de explorer o a que navegador atacar, no interfiere en firebug ni en validadores estandar, ¿quieres alguna más?

Sencillo, funcional y además valida.