28172 sujets

CSS et mise en forme, CSS3

Border radius et IE7 et 8

Bonjour,

J'ai suivi le tuto de Raphaël concernant la résolution du PB ie7 et 8 pour border radius:

la css


#menu
{border: 1px solid #877e6f;
/*radius*/
moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
behavior: url(pie/PIE.htc);
/*radius*/
background-color: rgb(255, 162, 0);
background-color: rgba(255, 162, 0, 0.1);
height:550px;
width:300px;
display:inline;
padding-top:30px ;
float:right;
margin:60px 40px 0 0;
}


Je teste à travers http://www.browserstack.com/
ça ne marche sur les IE7 et 8

Quelque chose cloche ou .browserstack.com n'assure pas?


merci
Administrateur
Hello,

Le chemin de url(pie/PIE.htc) doit être défini par rapport à la page HTML. C'est bien le cas ?
Bonsoir,

oui, index.html et le répertoire pie sont à la racine de www


J'ai également testé sur IE tester mais c'est pire, je n'ai même pas le background transparent alors que sur browserstack oui.

la page provisoire
http://essai.web2aconcept.fr/
Les valeurs rgba ne sont implémentées qu'à partir d'IE9, IE7/8 affichera donc en principe le fond orange uni.
> Essayer avec la version PIE.php
> SI ça fionctionne pas ajouter la déclaration position:relative

Tout ça est expliqué sur la page de documentation de PIECSS.
Modifié par Hermann (13 May 2013 - 00:22)
Modérateur
kayorn a écrit :
J'ai également testé sur IE tester mais c'est pire, je n'ai même pas le background transparent alors que sur browserstack oui.

Sinon sans bords arrondis c'est pas la mort non plus…

Et pour le fond transparent, ça peut aussi se régler avec une image de fond différente…
Si vous avez vraiment mis le fichier à la raçine de votre site vous devriez avoir quelque chose comme ceci :
.radius {
	behavior: url(/PIE.htc);
}

Et quand vous aurez finit par trouver l'origine de votre problème, mettez le code "behavior" dans un fichier css à part pour IE. Ça sera plus propre.
Olivier C a écrit :
Si vous avez vraiment mis le fichier à la raçine de votre site vous devriez avoir quelque chose comme ceci :
.radius {
	behavior: url(/PIE.htc);
}

Et quand vous aurez finit par trouver l'origine de votre problème, mettez le code "behavior" dans un fichier css à part pour IE. Ça sera plus propre.


non j'ai indiqué que c'est le répertoire complet pie contenant PIE.htc qui est à la racine. J'ai essayé également avec url(/PIE.htc) mais ça ne fonctionne quand même pas.
@herman
Bingo. si ces testeurs d'IE ne racontent pas de blagues, on dirait que ça fonctionne avec position:relative;. Merci

Merci à tous d'ailleurs!
Modifié par kayorn (13 May 2013 - 07:46)
Sujet clos
Aller à