English

Utiliser border-radius avec Internet Explorer 6, 7 et 8

Malgré tous nos efforts pour moderniser nos sites web et utiliser le meilleur des attributs CSS3, il reste encore quelques versions d'Internet Explorer qui nous donnent du fil à retordre. Heureusement, une solution très simple et peu encombrante existe pour implémenter quelques uns de ces attributs sans utiliser d'images ou de techniques archaïques: CSS3 PIE.

Configurer CSS3 PIE

  1. Commencez par visiter le site de CSS3 PIE, et sélectionnez les attributs que vous souhaitez utiliser.
  2. Téléchargez le fichier PIE.htc et mettez-le dans le même répertoire que votre fichier CSS.
  3. Ajoutez behavior:url(PIE.htc) à votre fichier CSS sur les éléments qui doivent avoir un border-radius.
  4. Videz le cache de votre navigateur et testez en mode IE7 ou IE8 (appuyez sur F12 pour ouvrir les options développeur et changez le mode de compatibilité)
Voilà! Vos coins arrondis s'afficheront maintenant comme il se doit dans Internet Explorer. N'oubliez pas d'utiliser les attributs requis pour Firefox et Opéra du même coup!
  1. Francis a dit (29 sept. 2011):

    Tu devrais intégrer le « +1″ de google + !

  2. Ahodan Konrad a dit (25 déc. 2011):

    Mercie Nicolas, mais sur css3PIE.com je ne trouve le fichier .htc a télécharger . Pouvez-vous encore m’aider …. Merci

  3. Nicolas Bouliane a dit (25 déc. 2011):

    Le fichier devrait être téléchargeable directement dans .zip avec les exemples, si je me souviens bien.

Laisser un commentaire