Rendre Font Awesome Icons compatible avec IE8

Au moment d’écrire ce billet, Font Awesome Icons est disponible dans sa version 4.0.3. Il s’agit d’une collection d’icônes utilisant une police vectorielle, gratuit et simple à utiliser. Le fait d’être une police vectorielle nous permet d’afficher les icônes à la taille de notre choix sans charger moultes fichiers. De plus, via la CSS, nous pouvons appliquer une couleur hexadécimale pour personnaliser les icônes.

C’est un outil indispensable pour chaque nouveau projet. Malheureusement, cette collection utilise des propriétés CSS3 (:before / :after) qui posent problèmes sous IE8. Les icônes n’apparaissent tout simplement pas avec le navigateur.

J’ai trouvé une solution sur le net, via stackoverflow, proposant d’ajouter un bout de code javascript sur le chargement de page :

On cache ainsi l’affichage des propriétés :before et :after, réglant ainsi le problème avec IE8.

Rémi on twitterRémi on linkedin
Rémi
Chargé de projets web de profession, je partage à travers ce blog mes expériences, recherches et découvertes dans la création de projet web.