Discussion :

[nicophoenix]

Bonjour à tous,

J'ai un soucis d'affichage sur mon site selon le navigateur :
C'est un site multilingue et le problème apparait sur les langues comme l'hébreu et l'arabe (je ne sais pas si ça a un quelconque rapport avec le fait que ces langues s'écrivent de droite à gauche).

Les caractères non hébreu en fin de ligne (donc a gauche en hébreu) s'affiche a droite sous Firefox et sous IE ils s'affichent à gauche (donc ça fonctionne sous IE et pas sur Firefox, le comble :p)
Quand je regarde dans la source du code généré les caractères de ponctuations apparaissent au bon endroit (a gauche) mais l'affichage est totalement différent....

Les caractères sont encodé en utf-8

Si quelqu'un à une idée d'ou peu venir mon problème ?

Je vous donne l'adresse de la page si jamais mes explications ne sont pas assez claires :
http://www.detective-marseille.com/index-he.html

Merci d'avances pour vos réponses.

[thelvin]

Ça a très certainement un rapport avec le fait que ces langues s'écrivent de droite à gauche, oui.

La page en question n'est pas toute petite, tu pourrais nous aiguiller un peu vers ce qu'il y a à voir ?

[nicophoenix]

En gros c'est la ponctuation comme les . ou : qui ne se place pas correctement sous Firefox :
Ex :
".כעצמאי במקצוע המעוגן בחוק מס" la phrase juste avant le premier lien dans le premier paragraphe, sous firefox j'ai le resultat suivant :
"כעצמאי במקצוע המעוגן בחוק מס."

Edit : Apres de nouveaux tests, j'ai un résultat correct également sous chrome (en plus de IE) et un autre résultat incorrect sous Opera si ça peu aider...

[thelvin]

Hum, c'est là qu'on voit les limites technologiques du mélange gauche-à-droite et droite-à-gauche.

- Pour le point dont tu nous parles :
J'ai vérifié avec un éditeur héxadécimal, avec un éditeur à sens forcé de gauche à droite, et avec la propriété CSS unicode-bidi : bidi-override
=> Ce point est situé en début de phrase dans le fichier. Rien d'étonnant donc à ce qu'il s'affiche en début de la phrase en hébreux.

- De manière générale :
Le HTML exige qu'on lui indique la direction "de base" du mode d'écriture de la page. Chez nous, par défaut, c'est bien sûr de gauche à droite.
Le problème avec la ponctuation, c'est qu'elle n'a pas de sens d'écriture intrinsèque. Si elle est au milieu de texte droite-à-gauche, pas de problème, elle ne casse rien. Si elle est au milieu de texte gauche-à-droite, pareil.
Et si elle a du gauche-à-droite d'un côté, et du droite-à-gauche de l'autre ? Elle est forcément cassée d'un côté. Elle prend la direction "de base", gauche-à-droite ou droite-à-gauche, en fonction de ce qui est défini à cet endroit.
Dernier cas : et si elle n'a du texte que d'un seul côté ? Dans ces cas-là, ce n'est pas clairement défini. Certains la mettent de même direction que le seul côté où elle a du texte, d'autres la mettent dans la direction "de base." Accessoirement, certains considèrent qu'un saut de ligne forcé <br> annule le contexte d'écriture, d'autres non.
=> d'où les résultats différents avec différents navigateurs.

Dans ta page, non seulement la direction droite-à-gauche de base n'est jamais définie, mais en plus il y a le contraire sur l'élément racine : j'ai vu un dir="ltr". 'Faut pas chercher les ennuis comme ça. Tu devrais indiquer dir="rtl" pour tout ce qui est principalement hébreu.

Conclusion :
- ton point est en début de phrase.
- le paragraphe <p> qui contient tes phrases hérite de la direction de base gauche-à-droite définie au début du document.
- Firefox et Opéra voient ton point en début de phrase, au milieu de texte hébreu. Ils décident de le mettre dans la même direction que l'hébreu.
- IE et Chrome voient ton point en début de phrase, début de ligne. Ils le mettent dans la direction de base, gauche à droite, donc à gauche. Après il y a de l'hébreu, ils mettent donc de l'hébreu après, à sa droite.

Pour mettre tout le monde d'accord :
- ton point doit être en fin de phrase, change cette page. (Bon courage, c'est pas évident, je sais. Le mieux est de taper les phrases à part séparément, et de copier-coller chacune séparément dans le HTML.)
- Indiquer un dir="rtl" dans tout ce qui est droite-à-gauche.

[nicophoenix]

Merci pour ta réponse, je vais essayer ça rapidement et je te dirais si ça marche