[Problème] Border-radius sous IE

[bizerte77]

Bonjour,

J'utilise border-radius et sur internet explorer ce n'est pas pris en compte. J'ai suivi le tuto d'alsacreation mais ça ne fonctionne pas. Faut-il régler quelque chose dans joomla?

Voici mon code actuel:

 .divtarif{
width:650px;
border:solid 1px black;
-moz-border-radius: 20px;
border-radius: 20px;
-khtml-border-radius: 20px;
-webkit-border-radius: 20px;
text-align:center;
}

J'ai ajouté à la suite : behavior: url(PIE.htc);

PIE.htc se trouve dans le même dossier que mon fichier CSS.

Merci par avance pour votre aide.

Bonne journée

[bizerte77]

Re : Border-radius sous IE

Re,

J'ai finalement utiliser le fichier js (également proposé dans le tuto d'alsacreation).

Bonne journée

[AlphaDesign]

Re : Border-radius sous IE

Bonjour,

Pour behavior il fallait préciser l' URL depuis la racine du site par exemple :

behavior: url(/templates/mon_template/mon_répertoire_css/PIE.htc); si PIE.htc est placé dans mon_répertoire_css

++, TT

[bizerte77]

Re : Border-radius sous IE

Bonjour,

Merci pour votre réponse mais entre temps j'ai dû changer mon code car j'ai besoin de mettre un background-color dans mon tableau.

Voici le code que j'utilise pour mon tableau :

<table class="tablotarif" >

    <tr class="top">
    <td class="border">CATEGORIE </td>
    <td class="border">ENTREE INDIVIDUELLE</td>
    <td >ACHAT EN LIGNE</td>
    </tr>
    <tr>
    <td class="border">Adultes</td>
    <td class="border">19€90</td>
    <td><a href="#">J'ACHETE</a></td>
    </tr>

<tr>
    <td class="border">Jeunes (13 à 17 ans inclus)</td>
    <td class="border">15€50</td>
    <td ><a href="#">J'ACHETE</a></td>
    </tr>

<tr>
    <td class="border">Enfants (3 à 12 ans inclus)</td>
    <td class="border">12€90</td>
    <td ><a href="#">J'ACHETE</a></td>
    </tr>

<tr>
    <td class="border">Enfants (<3 ans)</td>
    <td class="border">GRATUIT</td>  
    <td>-</td>
    </tr>

</table>

et voici le css pour arrondir mon tableau:

.tablotarif { border-collapse: separate; border-spacing: 0; width:100%;}
.tablotarif td {
    border: solid 1px #000;
    border-style:  solid solid 0px;
    padding: 10px;
}
tr:first-child td:first-child { border-top-left-radius: 20px; }
tr:first-child td:last-child { border-top-right-radius: 20px; }
tr:last-child td:first-child { border-bottom-left-radius: 20px; }
tr:last-child td:last-child { border-bottom-right-radius: 20px; }
tr:first-child td { border-top-style: 0px solid; }
tr td:first-child { border-left-style: 0px solid; }
behavior: url(/templates/beez_20/personal.css/PIE.htc);

C'est super sous firefox mais sous ie7 et 8 (j'ai pas testé 9) ce n'est pas pris en compte. (personal.css c'est le fichier où se trouve ce code).

Peut-être la syntaxe n'est pas bonne? ou faut-il configurer PIE.htc (ajouter quelque chose dans le fichier)?

Mille merci!

Bonne journée

[lefabdu51]

Re : Border-radius sous IE

ton url n est pas bonne ( a moins que tu ais un dossier personnal.css)

url(/templates/beez_20/personal.css/PIE.htc)

ton url devrais etre
url(/templates/beez_20/css/PIE.htc)

car je n ais pas compris pourquoi rajouter personal.css dans l'url, alors que dans ton tuto il n apparais pas.
pour moi ce fichier n existe pas, car personal.css est considéré comme un dossier et non comme un fichier.
/templates/beez_20/css/personal.css/PIE.htc

pour infos: http://css3pie.com/documentation/getting-started/
Of course you will need to adjust the path to match where you uploaded PIE.htc in step 2. Note: this path is relative to the HTML file being viewed, not the CSS file it is called from.

[AlphaDesign]

Re : Border-radius sous IE

Oui lefabdu51 a raison je t'ai donné une mauvaise structure d'URL précédemment j'aurai du écrire
behavior: url(/templates/mon_template/css/PIE.htc); si PIE.htc est placé dans le répertoire css, j'en profite pour corriger mon message précédent...

Merci a lefabdu51 d'avoir corrigé cette erreur

[bizerte77]

Re : Border-radius sous IE

Re,

Ah oui effectivement j'ai pas de dossier personal.css (c'est mon fichier) oui c'est juste css. Effectivement j'ai lu trop vite...

Je vais retester.

Merci

[kursus]

Re : Border-radius sous IE

Utiliser des hacks dégueus genre Pie pour pouvoir afficher des coins arrondis ou autres joyeusetés cosmétiques au boulet IE n'est pas une bonne idée.

Déjà parce que c'est super lourd et que ça met à genou une partie non négligeable des machines, mais aussi parce que ça n'encourage pas les gens à mettre à jour/changer de browser. En te pliant en quatre pour leur donner l'illusion que leur browser n'est pas une bouse, tu les confortes dans leur mauvais choix.

[cavo789]

Re : Border-radius sous IE

Utiliser des hacks dégueus genre Pie pour pouvoir afficher des coins arrondis ou autres joyeusetés cosmétiques au boulet IE n'est pas une bonne idée.

[Cri du coeur]
Je rejoins Kursus : marre de développer des hacks pour l'immonde explorateur. Si ton utilisateur utilise l'immonde truc, il verra des coins carrés et ce sera tant pis pour lui. S'il veut rester sous IE, qu'il opte pour le moins-pire de tous; le dernier en date. S'il veut vraiment utiliser internet, qu'il utilise FF ou Chrome mais pas IE.

Si le hack utilisé est un css ou un code js ou des imbrications de div p.e. cela alourdit la page et ralenti l'affichage.

Sur mon ancien blog, j'ai carrément installé un plugin system qui affiche un warning en haut de la page qui informe l'utilisateur que IE est à proscrire et qu'il faut utiliser un vrai browser.
[/Cri du coeur]