Tests sur quelques pseudos-sélecteurs

Pour rebondir sur l’article précédent de STPo et ses nombreux commentaires, j’ai voulu tester plusieurs choses :

• le support des pseudo-selecteurs version selecteur::pseudo-selecteur ;
• le support du pseudo-selecteur :first-line ; notamment quand on effectue un zoom-texte associé ;
• la prise en compte (ou non) des caractères typographiques combinés avec first-letter (ici le guillemet suivi ou non d’un espace et l’apostrophe).

Support

:first-letter et :first-line sont supportés sur tous les navigateurs habituels :

• IE 6 ;
• IE 7 ;
• IE 8 ;
• Firefox ;
• Opera ;
• Safari ;
• Chrome.

Assez étonnement ::first-letter et ::first-line ne sont pas pris en compte par IE 7 et IE 8 alors qu’ils marchent partout ailleurs (IE 6 compris).

Le comportement de first-line correspond bien au comportement attendu : la sélection varie en fonction du zoom effectué sur la page et il s’agit bien en permanence de la première ligne qui est sélectionnée.

Subtilités typographiques

En théorie devrait first-letter s’appliquer à la première lettre et donc à la ponctuation qui l’accompagne.

Les caractères de ponctuation […] qui précèdent la première lettre devraient également être pris en compte

En pratique on constate un rendu plus ou moins correct de :

• Chrome (hormis un petit bug avec les espaces insécables encodés  ) ;
• Safari (avec le même petit bug) ;
• Firefox (mais sans le support des espaces) ;
• Opera (mais uniquement avec des guillemets droits et sans le support des espaces) ;
• IE6 et IE 7 (mais uniquement avec des guillemets droits, exit donc les guillemets à la française) ;
• et IE 8 (mais sans le support des espaces, ce qui est fortement pénalisant là encore).

En une phrase : seul le moteur de rendu WebKit s’en sort correctement.

Voici le fichier qui m’a permis de faire mes tests, si vous voulez compléter mon analyse ou tester à votre tour. Vous pouvez également regarder le support navigateur proposé sur Web Devout.