CSS: comentarios condicionales

Los comentarios condicionales son el último recurso al que podemos acceder cuando ya no encontramos ninguna alternativa para que nuestra página web se vea correctamente en cualquier navegador.

Aunque sólo funcionan en Internet Explorer, esto es más que suficiente ya que es este el navegador que más inconvenientes nos provoca.

La estructura es similar a un comentario HTML (<!-- [comentario] -->) y los navegadores, actúan en consecuencia, ignorando el contenido, sin embargo, Internet Explorer está programado para reconocer la siguiente sintaxis:

<!--[if IE]>
   [instrucciones]
<![endif]-->

y procesar el contenido como si fuera una parte normal del contenido de la página.

Una limitación de estos comentarios condicionales es que sólo pueden ser incluidos dentro de un documento HTML y no dentro de una hoja de estilo CSS.

Debido a que hay múltiples versiones, las condiciones pueden ser complejas:

<!--[if IE]>
     cualquier versión
<![endif]-->

<!--[if IE 5]>
     Internet Explorer 5
<![endif]-->

<!--[if IE 5.0]>
     Internet Explorer 5.0
<![endif]-->

<!--[if IE 5.5]>
     Internet Explorer 5.5
<![endif]-->

<!--[if IE 6]>
     Internet Explorer 6
<![endif]-->

<!--[if IE 7]>
     Internet Explorer 7
<![endif]-->

También es posible establecer condiciones para versiones superiores o inferiores. Para ello, como no podemos utilizar los símbolos < o > , debemos reemplazarlos por sus equivalentes: (mayor que), gtlt (menor que), gte (mayor o igual que) y lte (menor o igual que):

<!--[if gte IE 5]>
     Internet Explorer 5 o superior
<![endif]-->

<!--[if lt IE 6]>
     Internet Explorer menor que 6
<![endif]-->

<!--[if lte IE 5.5]>
     Internet Explorer menor o igual que 5.5
<![endif]-->

<!--[if gt IE 6]>
     Internet Explorer mayor que 6
<![endif]-->

A decir verdad, el uso de estos hacks no está recomendado, cualquier purista del lenguaje los rechaza pero, personalmente, no dudo en usarlos si no queda otro remedio, algo que, cada vez, parece más ocurrir cada vez más seguido.