CSS para Internet Explorer

Muchas veces nuestra página web se ve perfecta hasta que PAM! la abres en Explorer y te quieres morir. Para arreglar esas cosas que sólo se “desmontan” en nuestro querido IE podemos fácilmente asignar a nuestra página un css que únicamente se aplique en el caso de que el explorador sea Internet Explorer de X versión (los Explorer más nuevos cada vex se comportan mejor, pero no se puede descartar, por ejemplo, una versión 9).

Por ejemplo, yo quiero afectar a la versión 9 de IE y anteriores:

  • <!--[if lt IE 10]> : IE 9 y anteriores
  • <!--[if IE 9]> : IE 9
  • <!--[if gte IE 9]> : a partir de IE9

Por lo tanto, tengo dos opciones, escribir directamente el código en el header de mi página (si son pocas modificaciones):

<!--[if lt IE 10]>
<style type="text/css">
	/* my css para IE 9 y anteriores */
</style>
<![endif]-->

O, si veo que esto será para largo, crear directamente una hoja de estilos aparte específica para Internet Explorer.

<!--[if lt IE 10]>;
<link href="styles_ie9.css" rel="stylesheet" type="text/css" />
<![endif]-->