blog sur le développement web, jquery,css3, Magento, Symphony, php et bien d'autres choses

image logo CSS3 PIE

CSS3 PIE

CSS3 PIE nous réconcilie avec IE

En effet CSS3 PIE est capable de rendre la plupart des effets CSS possible sous ie (bonus: de ie6 – ie8).

INSTALLER CSS3 PIE

rien de plus simple, allez sur le site de css3 pie en cliquant sur l’image plus haut

– télécharger la librairie css 3pie

– Dézippez le fichier télécharger, le fichier qui nous interesse est pie.htc

–  écrivez un peu de css trois sur une div sous Firefox

#myAwesomeElement {
    border: 1px solid #999;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

a la fin de votre css faites le lien vers css3 pie

behavior: url(path/to/PIE.htc);

le tour est joué! normalement, is cela ne marche pas geulez dans les commentaires! ^^

Commentaires sur: "css3 internet explorer et CSS3 PIE" (6)

  1. sunkikou a dit:

    Bonjour, et non cela ne marche pas.
    J’ai bien mon fichier PIE.htc lié dans une div où j’utilise du CSS3 (-moz-border-radius) par exemple.
    #divtest {
    -moz-border-radius: .4em;
    -webkit-border-radius :.4em;
    -khtml-border-radius:.4em;
    border-radius: .4em;
    behavior: url(PIE.htc);
    }

  2. bluesky a dit:

    avant d’arriver ici, je suis passé par « border-radius.htc » et « ie-CSS3.htc » qui comportent des tas de bugs. mais « CSS3 PIE » fonctionne à la perfection!!! merci infiniment. (aucune raison de gueuler ^_^)

  3. Gerry a dit:

    En fait pour que ça fonction il faut faire quelque chose dans le genre

    #divtest {
    -moz-border-radius: .4em;
    -webkit-border-radius :.4em;
    -khtml-border-radius:.4em;
    border-radius: .4em;
    behavior:url(../styles/PIE.htc);
    }

    où style est le dossier où se trouve ma faille de style et le fichier PIE.htc
    Par contre, on peut aussi utiliser l’adresse http://monsite.com/styles/PIE.htc

  4. aurel a dit:

    hey!!

    je ne comprends pas ça ne fontionne pas du tout…

    j’ai ce code :
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
    border:1px solid #f9ffff;
    background-color:#009a54;

    margin:0px;
    padding-left:13px;
    padding-top:6px;
    padding-bottom:6px;
    display:block;
    overflow:hidden;
    behavior: url(PIE.htc);

    mais rien à faire aucun arrondis…😦

  5. Clem a dit:

    L’emplacement du fichier PIE.htc est relative au fichier html et non au fichier css (comme dans le cas d’une image en backgrond)

    #arrondi
    {
        background:url(fond.png);
        border-radius:10px;
        box-shadow:0 0 5px black;
        behavior: url(styles/PIE.htc);
    }
    

Laisser un commentaire

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:

Logo WordPress.com

Vous commentez à l'aide de votre compte WordPress.com. Déconnexion / Changer )

Image Twitter

Vous commentez à l'aide de votre compte Twitter. Déconnexion / Changer )

Photo Facebook

Vous commentez à l'aide de votre compte Facebook. Déconnexion / Changer )

Photo Google+

Vous commentez à l'aide de votre compte Google+. Déconnexion / Changer )

Connexion à %s