28172 sujets

CSS et mise en forme, CSS3

Bug d'affichage - Border radius et IE9

Bonjour à tous,

J'utilise dans le thème que je suis en train de coder la propriété border-radius qui est donc désormais supportée par IE9. Si ce dernier l'applique donc enfin il ne semble pas le faire correctement et je ne comprend pas du tout pourquoi.

Je ne sais pas vraiment comment décrire le problème mais il manque parfois certains morceaux de bords et ils apparaissent et disparaissent à leur bon vouloir en fonction de si je passe la souris dessus ou si je rafraichi la page. Voici un exemple en image :
http://www.mrawesomeblog.fr/wp-content/uploads/2011/08/exemple.png

Voir en plus grand : http://www.mrawesomeblog.fr/wp-content/uploads/2011/08/exemple.png

Mon code est tout ce qu'il y a de plus banal dans l'utilisation de la propriété : Exemple :


-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-left-radius: 10px;
-webkit-border-bottom-right-radius: 10px;
-moz-border-radius-bottomright: 10px;
border-bottom-right-radius: 10px;


Voilà je ne sais pas si quelqu'un a rencontré cela auparavant, tout fonctionne sans problème sous Chrome, Safari, Opéra et Firefox donc je ne comprend pas trop pourquoi Internet Explorer fait cela ...
Modifié par HadMen (17 Aug 2011 - 22:47)
Bonjour HadMen,

pourquoi n'utilises-tu pas une écriture simplifiée? dans ton cas, ceci : 


border-radius: 0 0 10px 10px;


en ce qui concerne IE, ben, cela ne me surprend pas. toutefois, y a déjà eu un topic là-dessus sur Alsa, et le mieux serait d'utiliser le fameux CSS3pie, au moins pour les utilisateurs excessivement chanceux qui utilisent encore les anciennes versions IE Smiley lol Smiley lol Smiley lol .

rajoute également ceci : 


<meta http-equiv="X-UA-Compatible" content="IE=edge">


l'explication peut se trouver là entre autres :

blog.britoweb

bon courage.
FloydinBremen a écrit :

en ce qui concerne IE, ben, cela ne me surprend pas.


Moi si, je n'ai jamais eu aucun soucis avec border radius sous ie9, alors que je ne préfixe meme pas mes border radius et n'utilise pas non plus les fx microsoft.
Ton IE9 est-il a jour?
On ne sait jamais, peut être que ce problème a été régler par des MAJ Crosoft'!
Oui il est à jour et je me suis promené sur d'autres sites utilisant des border radius et cela fait la même chose chez eux donc c'est très étrange.
Si tu nous donner le lien du site on pourrait voir si chez nous ça fait la même chose!
On ne sais jamais^^
Bon j'ai ouvert le site que tu vient de me montrer et je ne vois pas de problème sur IE9! c'est identique a Chrome ou FF

attendons d'avoir d'autre réponses.
Je confirme, aucun soucis avec ie9 et rendu identique à FF chrome ou opera

Ton os, 64 ou 32 bits ?
Ton ie9, 64 ou 32 bits ?
Ton doctype ?
oui c'est maintenant évident, cela viens des paramètres graphiques de ta machine virtuel.

Rend toi dans les paramètres de ie9 (outil / option internet) ensuite tu clique sur la case "Utiliser le rendu logiciel au lieu du rendu GPU*" (que ca la coche ou la décoche ne change rien car on test pour voir si c'est ça) Tu fais "appliquer" puis ok puis tu quitte ie9 et tu le relance pour vérifier si les bords arrondis bug toujours.

Tiens nous au courant
Modifié par ptitvincent (18 Aug 2011 - 17:46)
Je vérifierai dès que possible sur un PC mais si ce n'est que cela, alors je suis rassuré.

Petite parenthèse, quelle est le meilleur équivalent d'une propriété background en rgba (ex : background: rgba(0, 0, 0, 0.8);) pour IE7 ? Il vaut mieux une PNG ou y'a t'il un remède miracle ? Merci beaucoup en tout cas Smiley smile
relis mon post juste au dessus je l'ai édité entre temps.

Pour la couche alpha moi je te conseil un png24 mais tu peux aussi faire ca en javascript (ou jquery ca sera plus simple)
Sujet clos
Aller à