Des perles CSS au cochon IE

mardi 29 août 2006 par Sébastien (lien permanent)

Il est possible d’émuler la propriété CSS max-width dans Internet Explorer 6.0 [1] et il existe également un moyen pour servir des « feuilles de styles Â» dédiées uniquement à Internet Explorer : les commentaires conditionnels.

Pour inclure des correctifs comprenant par exemple des expressions que seul IE comprendre on utilisera :

<!--[if lt IE 7]>
<link rel="stylesheet" href="ie_max-width_emulation.css" type="text/css" media="screen, projection" />
<![endif]-->

Exemple 1 : taille du body limitée à 40 em avec max-width en CSS et avec une expression pour IE.

Cependant, il ne s’agit pas vraiment de servir des feuilles de styles mais de fourrer du code dans des commentaires en suivant une syntaxe particulière (propriétaire et non standard).

Or les agents utilisateurs HTML ne sont pas sensés faire quoi que ce soit du contenu se trouvant à l’intérieur de commentaires HTML ; ce contenu n’est soumis à aucun standard particulier.

Alors pourquoi servir en tant que CSS (avec le type text/css) des règles faisant appel aux expressions IE, qui ne sont ni valides (donc pas vraiment du CSS), ni comprises par d’autres agents ? Les expressions IE ne font pas partie de la spécification CSS 2 [2] (ni de la révision 2.1) [3].

Le seul rapport que ce fichier conserve avec CSS c’est :

  1. Son extension (.css) qui fait que les serveurs vont lui associer le type text/css
  2. Le type associé dans l’élément <link>
  3. Certaines règles sont effectivement du CSS valide et le fichier en lui même ne posera aucun problème à un analyseur CSS, puisqu’il est sensé ignorer les règles qu’il ne reconnait pas.

Commençons par renommer le fichier, par exemple avec l’extension .txt ce qui signifie qu’il sera envoyé en tant que text/plain.

J’ai ensuite essayé de remplacer l’attribut type "text/css" dans le lien par text/plain, mais cela ne plaît pas à IE qui n’interprête pas du tout le fichier.

Cependant rien n’oblige à utiliser cet attribut puisque nous ne sommes officiellement plus dans le cadre du HTML. Suppression de l’attribut type : succès !

Ton fichier ne contient donc pas de hack CSS: rien ne repose sur un bug d’analyseur CSS et de plus ce fichier est spécifiquement destiné à IE, seul capable de le comprendre.

De même que les commentaires conditionnels d’IE ne sont pas un bug mais une fonctionnalité, cette technique utilisant les expressions ne repose pas sur un quelconque bug de l’analyseur CSS ni sur une absence de support pour un ni encore sur une mauvaise implémentation. C’est donc une technique fiable et pérenne ; ce n’est tout simplement pas du CSS.

Tout cela va dans le sens d’une meilleure séparation des composants standards et des différentes techniques de contournement (j’ai failli dire hacks…).

Est-ce que ça passe aussi sous IE7 ? Oui dans la beta 2. Je n’ai pas encore installé la RC1.

Est-ce que ça pose des problèmes de cache ? Pas d’après mes tests sommaires effectués sous Windows XP Pro.

Notes

  1. Lire à ce sujet les articles de Svend Tofte et de Georg [retour]
  2. Version française de la spécification CSS 2 [retour]
  3. Il existe bien une tentative — qui demeure dans les limbes du W3C depuis 1999 et qui pourrait faire partie d’une future spécification CSS3 — mais expression ne fait pas partie des nouvelles propriétés suggérées. [retour]

← article précédent – article suivant →

Les commentaires pour cet article sont fermés.