Commentaires conditionnels pour IE

Publié le par PêUR

Avant de commencer cet article, je voulais juste vous signaler que depuis le 2 décembre 2006 mes articles risque d'être parfois mal formatés ou avoir des liens internes qui ne fonctionnent pas.

C'est normal, je prépare la V2 d'Over-Blog et adapte en conséquence mon design et la structure de mon blog. Vous allez peut-être aussi constater des modifications dans le nom des catégories et la répartition des articles dans ces catégories ainsi que d'autres petits détails.

J'éspère que vous ne m'en tiendrez pas rigueur! En tout état de cause, la prochaine version de mon blog qui apparaîtra avec la nouvelle version d'Over-blog, sera plus lisible et plus fonctionnelle.

Revenons à nos moutons...

À cause de sa faible prise en compte des standards web, Internet Explorer (que j'abrégerai par la suite en IE) fait l'objet de nombreux hacks CSS (J'en use et abuse parfois, voir l'article Des règles CSS pour un résultat identique selon le navigateur).

L'inconvénient de ces hacks CSS, c'est qu'ils utilisent des failles connues des navigateurs et vous n'êtes pas à l'abri qu'elles soient corrigées dans une version supérieure.

Avec la diffusion massive d'IE7 (que le logo est moche!) qui résout certains bugs de la version 6 et rend inopérant certains hacks CSS (star-html, tantek, selecteurs parent et adjacent entre autre), on se rend compte (j'aurais mis le temps!) qu'il faut éviter les hacks CSS et préferer les commentaires conditionnels.

Qu'est-ce que c'est?

Les commentaires conditionnels sont des commentaires HTML spécifiques qu'IE sait interpréter contrairement aux autres navigateurs.

Comment ça marche?

Les commentaires conditionnels existent sous 2 formes: positive ou négative.

Les commentaires conditionnels positifs exposent leur contenu seulement aux navigateurs pour lesquels la condition est vérifiée (Cela sous-entend les versions IE de la condition).

Les commentaires conditionnels négatifs exposent leur contenu aux navigateurs pour lesquels la condition n'est pas vérifiée (autrement dit, tous les autres navigateurs: Firefox, Safari, Mozilla... ET les versions d'IE qui n'entrent pas dans la condition).

Syntaxe

La syntaxe d'un commentaire conditionnel positif est:

HTML

<!--[if condition]> HTML <![endif]-->

Et celle d'un commentaire conditionnel négatif est:

HTML

<!--[if condition]><![IGNORE[--><![IGNORE[]]> HTML <!--<![endif]-->

condition est une des conditions suivantes:

  • IE : Toutes versions d'IE
  • lt IE version: Toutes versions d'IE inférieures à version
  • lte IE version: Toutes versions d'IE inférieures ou égales à version
  • IE version: Seulement la version version d'IE
  • gte IE version: Toutes versions d'IE superieures ou égales à version
  • gt IE version: Toutes versions d'IE superieures à version

version est la version d'IE ciblée: 5, 5.5, 6 ou 7.

HTML est le code HTML qui sera interprété par le navigateur selon que la condition est vérifiée ou non. Quand le code HTML est interprété par le navigateur, il est placé à droite de l'emplacement du commentaire dans le flux du document.

Aller plus loin

Dans le cas où vous souhaitez faire un commentaire conditionnel négatif dont la condition s'applique à IE en général et pas à une version précise, vous pouvez utilisez le code suivant, plus simple:

HTML

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

Il est bon de préciser que la syntaxe des commentaires conditionnels négatifs est susceptibles de provoquer des erreurs de parsing dans un document XHTML traité en tant que XML. Traduction: cette syntaxe n'est pas valide XHMTL.

Quelques liens traitant du sujet

 

Publié dans Webdev

Pour être informé des derniers articles, inscrivez vous :

Commenter cet article

toronto web design 16/02/2015 10:28

Florigène est produite dans les feuilles dans des conditions et des actes dans les bourgeons et la reproduction favorables points de croissance pour induire un certain nombre de changements physiologiques et morphologiques.

testing omni tech support 08/12/2014 13:17

It is very true that the poorly formatted internal links does not work most of the time. This has to make into the perfect links before it is posted. This includes the web standards and the CSS rules.

abdomain referencement 15/09/2007 20:01

Bonjour, j'ai mis
comme vous l'avez indiqué sur un autre tutorial sur le menu en bas à droite, pourtant le menu continue d'apparaitre sous IE6 et de faire bugger la page car il ne s'affiche pas correctement. Avez vous une idée pourquoi cela?
Cordialement

mahina 08/01/2007 13:25

alors...Bon Anniversaire à toi!! sourire

PêUR 08/01/2007 23:29

:D

sugi la fourmiz 07/01/2007 19:39

Kikou Guillaume :-)
Je te l'ai déja dis par mail mais je te le redis sur ton blog: Heureuse année 2007
Et puis Joyeux Anniversaire alors ^_______^

Bisous

sugi la fourmiz

PêUR 07/01/2007 21:15

Bises :D