aIE !

Si vous touchez de près ou de loin au développement Web , vous savez sans doute qu’Internet Explorer est un navigateur déplorable. J’ai une fois de plus pû le constater aujourd’hui à la lecture du blog de mon camarade YoGi.

Alors que je tentais d’accèder son billet traitant du logiciel AltDesk, mon aggrégateur RSS FeedDemon me fit une erreur avant de planter. Le message d’erreur m’ayant mis la puce à l’oreille. J’ai tout de suite testé avec Internet Explorer et ai constaté le même souci.

Après quelques minutes j’ai réussi à isoler le problème. Voici un exemple pour le reproduire :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xml:lang="fr" xmlns="http://www.w3.org/1999/xhtml"> <head>   <style type="text/css">   <!--     div p:first-letter {       background-color: #FF0000;     }   -->   </style>   <title>Test</title> </head> <body>   <div>     <p><a href="#">Test</a></p>   </div> </body> </html>

Ce code est pourtant parfaitement valide et FireBird l’affiche sans aucune difficulté.

J’ai constaté cela sur deux PC différents tournant tous les 2 sous Windows XP Pro (l’un en Français, l’autre en Anglais) avec la toute dernière version d’Internet Explorer avec tous les patchs de sécurité sortis, à savoir la version 6.0.2800.1106.XPSP2.030422-1633. Je ne sais pas cela se produit sur d’autres versions du navigateur ou du système d’exploitation.

Ce qui est amusant c’est que si l’on modifie le code comme ceci, cela ne plante plus :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xml:lang="fr" xmlns="http://www.w3.org/1999/xhtml"> <head>   <style type="text/css">   <!--     div p:first-letter {       background-color: #FF0000;     }   -->   </style>   <title>Test</title> </head> <body>   <div>     <p>Ceci est un <a href="#">Test</a></p>   </div> </body> </html>
Ce contenu a été publié dans Développement Web. Vous pouvez le mettre en favoris avec ce permalien.

6 réponses à aIE !

  1. YoGi dit :

    Remplace ton lien par un <em>, et tu as le probl?me qui s’est produit chez moi.

    Amusant, m?me si dans l’absolu c’?tait un peu risqu?.

  2. JMF dit :

    YoGi>Amusant, m?me si dans l’absolu c’?tait un peu risqu?.

    Je dois avouer ne pas avoir compris ce que tu voulais dire par l?.

  3. YoGi dit :

    j’avoue m’?tre interrog? sur le comportement du navigateur par rapport ? un jeu de balises du type <p><em>bla</em></p> avec le pseudo element :first-letter { … } sur le paragraphe, vu qu’on pourrait envisager qu’une mauvaise impl?mentation confondrait "premi?re lettre" et "premier caract?re".

    Pour le coup, Firebird se comportant bien,je n’ai pas pouss? l’exp?rience plus loin. Peut etre aurais-je d? et essayer avec IE, puisque comme tu le pr?sentes ici , ce dernier n’appr?cie gu?re.

  4. JMF dit :

    Personnellement j’utilise div.bloc div.contenu>*:first-child:first-letter pour arriver au m?me effet.

    Cela est r?serv? aux navigateurs valides car il y a un s?lecteur CSS2 qu’Internet Explorer ne sait pas g?rer. (>) Ainsi que le joker * lui aussi ignor? par IE.

  5. Emmanuel dit :

    Sur IE version 6.0.2800.1106IS, Win 2000 SP1, le probl?me se produit aussi.

    Dans ta seconde proposition (qui ne pose pas probl?me), si tu r?duis le texte "Ceci est un " jusqu’? ne laisser qu’un seul caract?re, ?a marche encore "C ".

    Par contre, si tu enl?ves l’espace entre le caract?re et la balise ?a?, ?a plante IE.

  6. JMF dit :

    J’avais bien remarqu? ce ph?nom?ne mais pour que l’exemple soit plus « joli » j’avais mis une phrase enti?re. 🙂

Les commentaires sont fermés.