div {
border: 10px solid;
padding: 10px solid;
}

@media tty {
i{content:"\";/*" "*/}} @import 'midpassbefore.css'; /*";}
}/* */

div {
width: 100px;
}

@media tty {
i{content:"\";/*" "*/}} @import 'midpassafter.css'; /*";}
}/* */

Néanmoins, l'abus de CSS Hacks peut s'avérer très vite dangeureux, tant les feuilles de style deviennent progressivement illisibles et particulièrement difficiles à maintenir. L'exemple ci-dessus (le Mid Pass Filter Hack) parle de lui même. Imaginez donc ce que ça peut donner quand vous tentez de faire cohabiter des hacks pour différents navigateurs (un hack pouvant très bien rentrer en conflit avec un autre). A part une aggravation de votre calvitie peut-être déjà bien prononcée, au final vous ne gagnerez pas grand chose.

Fort heureusement, et à moins d'être un peu maso (star seven hack.. ça aurait pu être le nom d'un proggie AOL, ph34r), bien souvent les seuls hacks que le commun des mortels tente de déployer sont pour IE. Et là, j'en viens à l'essence même de ce billet (oui, ça a été long à introduire, je vous l'accorde) : sachez que Microsoft a pensé à vous en introduisant les commentaires conditionnels, des commentaires HTML qui, comme leur nom ne l'indique pas vraiment, permettent de faire la même chose que les CSS Hacks pour IE, mais en bien plus simple. Et donc en bien mieux.

Plutôt qu'une longue explication, une courte démonstration. Voici l'équivalent du CSS Hack précédent (Mid Pass Filter Hack le bien nommé) avec des commentaires conditionnels. Observez bien la magie s'opérer :

<style type="text/css">
div {
border: 10px solid;
padding: 10px solid;
width: 100px;
}
</style>

<!--[if IE 5]>
<style type="text/css">
div { width: 140px; }
</style>
<![endif]-->

Hop, c'est passé. Je ne sais pas pour vous, mais pour ma part je crois qu'il n'y a pas grand chose à rajouter et que la démonstration est suffisamment convaincante en elle même. La panoplie d'opérateurs disponibles est suffisamment large pour permettre de cibler n'importe quel des IE en version 5 ou supérieure. Et évidemment, mais ça vous l'aviez bien compris, vu des autres navigateurs, c'est un simple commentaire HTML sans intérêt. Bref, du bonheur en barre.

A la base, je devais rédiger un billet très court pour présenter les commentaires conditionnels, parce que ça me semble relativement méconnu et que ça reste au demeurant fort pratique. Mais vous me connaissez, je me suis embarqué dans des explications pas possibles, bla bla box model hack bla bla star seven , et pour le coup, je me suis embrouillé dans la réflexion que je voulais développer, plein d'informations ont fusé pêle-mêle sans trop de liens entre elles, le titre du billet n'est plus trop pertinent (d'où l'ajout du sous-titre), et là, se pose à moi un gros problème : comment conclure tout ceci avec classe et élégance. Et bien, je me contenterai d'ajouter la chose suivante :

Les CSS Hacks nuisent gravement à la santé

Et là, je m'en vais comme un prince.