IE et border-radius.htc

Bonjour tous

Déjà utilisé border-radius.htc avec succés, mais cette fois le cadre s'affiche une 1/2 seconde sur IE8 et disparait.
Il suffit de réactualiser la page pour s'en rendre compte.
Il me semble avoir eu ce problème sur un autre mais je sais plus comment je l'avais résolu, un truc tout bête il me semble (comme d'hab )

La page de test : h ttp://www.terrenfeu.fr/terrenfeu/laurent/fr/useful_sculptures.html
( erreur volontaire de http pour éviter les bots)
Modifié par griggione (03 Jun 2011 - 17:59)

Bonjour fvsch

Je viens juste de reprendre ce site et je n'ai pas encore fait tout le tour
Je sais bien qu'il faut éviter les scripts JS mais pour l'instant c'est la solution la plus simple pour avoir un cadre avec coins arrondis.

Et je me pose la question, pourquoi ça marche sur d'autres sites (que je suis) et pas ici ???
J'avais eu le problème mais je sais plus comment je l'avais réglé, donc si quelqu'un l'a eu aussi, ce serait sympa de donner la soluce.

Bonjour tous

Personne n'a d'idée ?
Ou même une autre solution pour un cadre bords arrondis ?
Ce que je comprend pas c'est que j'utilise border-radius.htc sur d'autres sites sans problème, pourquoi là ça ne marche pas.

Je suis bien allé voir : http://www.alsacreations.com/tuto/lire/891-coins-arrondis-css-sans-images.html
pour utiliser CSS3pie.com, mais une fois téléchargé le .zip on fait quoi des 5 fichiers, aucun .text pour expliquer.
Et si on suis le lien http://css3pie.com/documentation/supported-css3-features/ , c'est en anglais
Il faut utiliser quoi comme fichier, que pie.htc ou que pie.js ou les deux ?
Il faut les mettre ensemble ou pas ?

Toujors dans le lien d'Alsa, pour Roundies.js, la aussi il me manque une explication.
Il est dit:

a écrit :
A présent, il faut indiquer quels seront les éléments qui bénéficieront des coins arrondis. Pour cela, vous devez ajouter une instruction DD_roundies.addRule, soit à la fin du fichier roundies.js, soit dans le code de votre page (de préférence avant la fin de l'élément body, après l'appel à roundies.js).

Comme je vois rien dans la page exemple, je suppose que c'est dans le .js, mais dans ce cas faut rajouter quoi au juste et ou en fin de code, aprés la balise de fermeture ?
Et on rajoute juste DD_roundies.addRule comme ça ou comme dit après selon le choix :

a écrit :
DD_roundies.addRule('div.arrondi', '10px');
DD_roundies.addRule('h1', '10px');
DD_roundies.addRule('a', '8px');

Bijour-bijour,

Ça, c'est à corriger en urgence :

http://img843.imageshack.us/img843/7837/captureyhp.png

Uploaded with ImageShack.us


Concernant les coins arrondis : est-il vraiment préjudiciable qu’ils n’apparaissent pas sous IE ? Notez que de nos jours, les internautes sont plus équitablement répartis qu’ils ne l’étaient avant entre les différents navigateurs, et donc les coins arrondis en CSS3, seront visibles par beaucoup plus de monde que vous ne le pensez peut-être.

Si malgré cette remarque, il reste important qu’ils apparaissent sous IE, alors pourquoi ne pas tenter des boites avec coins arrondis utilisant des images de fond ? (je veux dire, tout le dessin de la boite, pas coin par coin, afin d’éviter de polluer la page avec du balisage inutile). Si les boites sont de tailles fixes, la mise en œuvre ne posera pas de difficulté insurmontables.

Bonjour hibou57

Comme dit au début, c'est un site que je reprend dont le menu sera différent, c'est pour ça que j'ai donné le lien de la page en cours uniquement en attendant de me servir d'includes.

Ma question n'est pas de chercher une alternative mais bien de savoir qu'est-ce qui fait que cette fois le border-radius.htc ne passe pas.

Ou au plus, avoir une réponse sur les deux alternatives proposées par Alsa.

griggione a écrit :
Ma question n'est pas de chercher une alternative

Et pourquoi pas ? Quelles sont les raisons de ce refus ?

griggione a écrit :
mais bien de savoir qu'est-ce qui fait que cette fois le border-radius.htc ne passe pas.

Peut-être une réponse ici : Impossible de faire fonctionner border-radius.htc (alsacreations.com)

Ou éventuellement une suggestion de cause indiquée par Download: Border radius htc v3 with IE6, 7 & 8 support qui dit “Uploaded: Nov 18, 2009”. Depuis cette date, il y a peut-être eu des mises à jours automatique de IE8, faisant que cette solution ne fonctionne plus.

griggione a écrit :
Ou au plus, avoir une réponse sur les deux alternatives proposées par Alsa.

PIE.htc a sa propre page de documentation ici : Progressive Internet Explorer CSS3Pie

griggione a écrit :
mais une fois téléchargé le .zip on fait quoi des 5 fichiers, aucun .text pour expliquer.

C’est indiqué par les noms de fichiers : deux des trois fichiers sont une version non-compressées l’une de l’autre, c’est à dire destiné à être lu, mais pour la publication sur un site, mieux vaut utiliser les version compressée.

PIE.php, comme l’indique le commentaire qu’il contient, ne fait que servir PIE.htc avec le bon Content-Type (votre fichier HTC est déjà renvoyé avec le bon Content-Type).

griggione a écrit :
Il faut utiliser quoi comme fichier, que pie.htc ou que pie.js ou les deux ? Il faut les mettre ensemble ou pas ?

Après une rapide consultation, il me semble que les deux sont indépendants (en tous cas il n’ont aucune référence réciproque).




Permettez-moi de vous faire part de mon sentiment sur la question (attention, je vais être sévère) :

Ça ne vous fait pas peur toute cette usine à gaz pour des coins arrondis ? Ce n’est plus du design, c’est de l’obsession à ce point là. Comme suggéré à raison par Fvsch (il sait quand-même de quoi il parle), il serait plus intéressant de reléguer cet aspect là au détail et de s’occuper des priorités incontournables tout d’abord.

J’ai aussi tenté les HTC pour différents effets visuel il y 3 ans de cela environ. Après les expériences que j’en ai eu, J’ai préféré abandonné cette idée : comme cela vous a été expliqué plus haut, c’est la cause de beaucoup d’effets secondaires non-maitrisables, et c’est souvent rendu inopérant, depuis que les HTC ont été identifié comme faille de sécurité potentiel par Microsoft, et qu’ils sont par défaut ignorés par beaucoup d’installation d'IE (c’est peut être le cas chez vous aussi), … et vous n’allez quand-même pas demander à vos internautes d’ajuster leur paramètres de sécurité juste pour qu’ils puissent voir des coins arrondis sur votre page ? Ou si ?
Modifié par hibou57 (04 Jun 2011 - 13:47)

RE

hibou57 a écrit :

Peut-être une réponse ici : Impossible de faire fonctionner border-radius.htc (alsacreations.com)

Le chemin est le bon et le fichier est bien lu puisqu'il passe sur les autres fureteurs.

hibou57 a écrit :

Ou éventuellement une suggestion de cause indiquée par Download: Border radius htc v3 with IE6, 7 & 8 support qui dit “Uploaded: Nov 18, 2009”. Depuis cette date, il y a peut-être eu des mises à jours automatique de IE8, faisant que cette solution ne fonctionne plus.

C'est bien la dernière version, et pour les MàJ aucune inquiètude, rien ne se fait automatiquement.

hibou57 a écrit :

PIE.htc a sa propre page de documentation ici : Progressive Internet Explorer CSS3Pie

Comme souligné avant, c'est la version anglaise et surement la seule sinon Elsa aurait donné le lien en franchouillard.

hibou57 a écrit :

Après une rapide consultation, il me semble que les deux sont indépendants (en tous cas il n’ont aucune référence réciproque).

Donc si j'ai bien compris, on peut utiliser l'un ou l'autre ........

hibou57 a écrit :

Ça ne vous fait pas peur toute cette usine à gaz pour des coins arrondis ? Ce n’est plus du design, c’est de l’obsession à ce point là. Comme suggéré à raison par Fvsch (il sait quand-même de quoi il parle), il serait plus intéressant de reléguer cet aspect là au détail et de s’occuper des priorités incontournables tout d’abord.

Usine à gaz ........ quand même
Bien sur que je respecte les réponses de Fvsch, mais je viens demander pour un cas précis et comme dit avant, je suis sur cet aspect, les autres aspects seront traités par la suite.
Perso je m'en fiche des coins arrondis ou pas, mais celui qui a le site y tient particulièrement.
Et comme beaucoup, il comprendra pas qu'on le traite d'obsessionnel pour "juste des arrondis" qu'on voit de partout.

Je suis venu poser la question pourquoi, parce que border-radius.htc marche sur d'autres sites que je suis et pas sur celui-là.
Je demande pas plus, juste POURQUOI sur un site donné, ça marche pas.
Surtout que j'avais eu le cas et je me rappelle plus comment je l'avais résolu, il me semble qu'il fallait simplement rajouter un background mais c'est pas le cas ici

hibou57 a écrit :

… et vous n’allez quand-même pas demander à vos internautes d’ajuster leur paramètres de sécurité juste pour qu’ils puissent voir des coins arrondis sur votre page ? Ou si ?

Par contre ça c'est un argument pour justifier un border bien classique

griggione a écrit :
Je demande pas plus, juste POURQUOI sur un site donné, ça marche pas.

Personnellement, strictement aucune idée et rien à fiche.
(Bien sûr ça n'interdit à personne sur ce forum ou ailleurs de s'intéresser au problème. Dans ce cas on se penchera peut-être, via les outils pour développeur d'IE8 ou des outils tiers, sur les accès réseaux -- est-ce que le fichier .htc est bien récupéré par le navigateur? -- et éventuellement les erreurs JavaScript qui peuvent être notifiées dans la console JS.)

griggione a écrit :
Perso je m'en fiche des coins arrondis ou pas, mais celui qui a le site y tient particulièrement.
Et comme beaucoup, il comprendra pas qu'on le traite d'obsessionnel pour "juste des arrondis" qu'on voit de partout.

Je répète mon conseil qui n'engage que moi et le précise un peu:
- Si on ne tient pas absolument aux coins arrondis dans IE 7-8, traiter ça en dégradation gracieuse.
- Si on y tient absolument, faire ces coins arrondis à base d'images. Ceux-ci sont très simple, des SPAN vides positionnés en absolu dans les coins du bloc devraient faire l'affaire. Ou autre technique à base d'images de fond, il y en a tout un tas.

griggione a écrit :
Le chemin est le bon et le fichier est bien lu puisqu'il passe sur les autres fureteurs.

Les autres navigateurs ne lisent pas les fichiers .htc, ils s'en fichent royalement. Si ces autres navigateurs affichent bien des bords arrondis, c'est parce qu'ils comprennent sans doute les déclarations border-radius utilisées à la base dans le CSS.
Donc ce point reste à vérifier.

Autres choses à vérifier aussi (en dehors des erreurs JS dans la console):
- La page est bien affichée en mode de rendu IE8, et pas mode de compatibilité IE7 ou IE5 (information à retrouver dans les developer tools).
- On accède à la page depuis une URL http, pas depuis une URL file:///... (les règles de sécurité appliquées dans ce dernier cas sont drastiques).

Bonjour griggione
J'ai eu un problème équivalent sur un bouton
En réalité, il s'affichait sous mon background de l’élément parent.
J'ai résolu ca en appliquant une "position:relative" sur ce même bouton
Tout est rentré dans l'ordre
Ce qui m'inquiète c'est plus le manque de recul face à ce problème.
Une erreur de ma part héritée ou juste un conflit avec le background parent.

Bonjour domvrignaud

C'est noté, la prochaine fois que j'aurais le même problème, je pourrais le régler.
Merci.