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.