Texte invisible dans balise small

Bonjour à tous,

Dans du code généré par un CMS (qui s’appelle publigen) les légendes des images sont rendues dans une balise <small> à laquelle on applique un style "legend".

Mon problème : pour une même page, certaines légendes s'affichent et d'autre non. Cela se produit uniquement sous IE. Comme vous pouvez le voir sur la capture jointe, le texte existe bel et bien (on le voit dans Firebug). Sur cette image, j'ai sélectionné le texte de la légende avec la souris : il n'est pas mis en surbrillance. Mais si je fais copier-coller dans un editeur, j'ai bien mon texte dans le presse-papier. Dès que je joue avec les options de firebug, comme par exemple décocher une case dans la CSS, le texte apparaît comme par magie.

La solution la plus probable semble qu'un contenu HTML mal formé existe un peu en amont de la légende en erreur, que IE trébuche dessus et refuse de traiter la suite du DOM jusqu'à retomber sur ses pieds mais je ne vois rien de bloquant, même assisté par le site de validation W3C.

Quelqu'un a une idée ?

Sur quelle version de IE testes-tu ? Le problème que tu décris correspondrait assez bien à un problème de "haslayout", donc ne concernant que les versions de IE inférieures à la 8

Sur ton screen, on peut voir que tu es en "normes IE7". Si tu passes en rendu IE8 / 9 le problème est-il toujours présent ?

Si oui, peux-tu donner un lien vers ta page que l'on puisse observer le bug ?

Si non, et que tu souhaites corriger pour IE7, rajoutes un * {zoom:1} dans ton css et reteste. Bug toujours présent ou non?

Si oui, peux-tu donner un lien vers ta page que l'on puisse observer le bug ?

Si non, il ne te reste qu'à supprimer le code CSS ajouté et isolé le/les élément(s) ancêtre(s) qui a/ont besoin du layout pour que tout fonctionne correctement.

Merci pour ces éléments :)

Je teste sur IE8, en "mode navigateur IE7" c'est la configuration des navigateurs ici et il faut que ca fonctionne dans ce mode. Ceci dit, cette suggestion m'a permis de constater un autre symptôme : Lorsque IE est en "mode navigateur IE8" le bug ne se produit pas.

J'ai ajouté "zoom:1" dans la section "*" de la CSS mais cela ne change pas, je suppose qu'il ne s'agit donc pas d'un problème de haslayout.

Je ne peux malheureusement pas livrer le code complet de la page sans me faire taper sur les doigts. Ceci dit : sur une page en 2 langues contenant 5 images, seules 2 images ont ce problème : une dans sa version française et une autre image dans sa version anglais.
Comme il s'agit d'un CMS, tous ces contenus image/légende sont générés de la même façon, j'ai passé les codes sources dans winMerge pour comparer le code d'une légende qui s'affiche/le code d'une légende qui buggue : strictement identique !

D'où mon désarroi.

EDIT : je fait une petite vidéo d'un cas d'utilisation (fichier swf joint)
- au chargement de la page : pas de légende
- si je choisis mon élément "small" je vois que le texte existe bel et bien
- si je sélectionne le texte dans la page, il ne se met pas en surbrillance, mais il est bien sélectionné et copié
- je peux le coller (par exemple dans la barre d'adresse)
- si je coche/decoche n'importe quelle case de la CSS, il apparait ! 8O

Citation:

---

Envoyé par SkyBack

J'ai ajouté "zoom:1" dans la section "*" de la CSS

---

Je suppose que tu veux dire: J'ai ajouté "zoom:1" pour le sélecteur "*" ? ;)

Citation:

---

Envoyé par SkyBack

mais cela ne change pas, je suppose qu'il ne s'agit donc pas d'un problème de haslayout.

---

Effectivement, en principe le problème aurait dû disparaître s'il s'était agi d'un prblème de haslayout.

Citation:

---

Envoyé par SkyBack

Je ne peux malheureusement pas livrer le code complet de la page sans me faire taper sur les doigts.

---

Sans observer le bug il va être difficile de t'aider... Nul besoin de tout le code, l'idéal serait que tu isoles la structure de code minimum qui fasse apparaître le problème. En gros, tu enregistres ta page complète en local, puis tu coupes dans le html et dans le css tout ce que tu peux sans que le bug ne disparaisse. Une fois que tu as le strict minimum, tu le postes (en remplaçant les textes / liens / images par du lorem ipsum,.... au besoin)

Ou alors, si tu trouves un autre site en ligne qui utilise le même CMS et sur lequel le problème est présent, tu peux donner le lien.

Sur ton screen, on voit qu'il y a un commentaire et un noeud texte vide juste avant la légende en question. Sur IE6, en tous cas, certaines configurations impliquant un commentaire pouvaient être source d'un bug. Je ne sais pas si, à tout hasard, cela pourrait être le cas ici.

Non, sérieusement, je peux pas faire mieux que la vidéo.
De une à cause la confidentialité du client, de deux, c'est un vieux CMS avec une multitude de fichiers ASP illisibles* qui génèrent le html des pages, couplés avec une demi-douzaine de CSS selon les contextes.

Seulement, c'est dans les vieux pots qu'on fait la meilleure soupe, ce système antédiluvien fonctionne très bien pour énormément de sites, je suis quasi-certain qu'il s'agit d'un contenu entré par l'utilisateur en guise de paragraphe qui fait bugger IE plus haut.

Je postait ici surtout pour savoir si cette disparition/apparition de texte rappelait une idée à quelqu'un.

* illisibles : fichiers de 20000 lignes dont chaque variable s'appelle v1,v2,etc et chaque fonction f1,f2,etc.

Bon, on va dire que c'est bon.
Je n'ai toujours pas le fin mot de l'histoire mais j'ai pu bidouiller la légende pour qu'elle apparaisse.
A priori, il y avait une mauvaise interaction avec un js qui affiche le contenu de la page sous forme d'onglets en accordéon.

Merci à Candygirl pour son aide.