Discussion :

[GrandFather]

Bonjour,

je suis confronté à un problème assez énervant...

Soit une page XHTML comprenant le bout de code suivant :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
<p>
  <span style="text-decoration: underline; ">Jour de sortie</span>
</p>
<ul>
  <li>
    <p>En établissement public :</p>
    ...

Je sais que le code n'est pas très propre, mais il est généré automatiquement ; cette page est liée à une feuille de style CSS comprenant ce style :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
P {
  text-align: justify;
}

Le résultat, plutôt surprenant, est que le texte "Jour de sortie" est bien souligné, mais que le paragraphe "En établissement public :" l'est aussi, et tous les autres paragraphes de la page ! Comme si le style local se propageait à toute la page...

Je sais que IE 6 gère mal les text-decoration, mais il me semblait que ces problèmes se limitaient aux éléments imbriqués, pas aux éléments frères.
J'ai tenté de régler le problème en rajoutant un text-decoration: none à la définition de P dans le CSS, sans succès.

Je vois arriver le moment où je vais devoir ajouter un style="text-decoration: none" à tous les autres paragraphes, mais si je pouvais éviter cela, et que quelqu'un avait une solution ou une explication, je lui en serais reconnaissant...

[SpaceFrog]

Lut Grand Pa

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

ul.li.p { style prope au paragraphe}

[GrandFather]

Salut Froggy

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

ul.li.p { style prope au paragraphe}

Nope. J'ai tenté cela :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
ul.li.p {
text-decoration: none;
color: red;
}

Le deuxième paragraphe est resté souligné, et n'est pas passé en rouge. J'avoue que là je patauge...

[_dranece_]

Essayes en remplaçant les points par des espaces:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
ul li p {
text-decoration: none;
color: red;
}

[GrandFather]

Essayes en remplaçant les points par des espaces:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
ul li p {
text-decoration: none;
color: red;
}

Bon, y'a du mieux (si on peut dire) : le paragraphe est toujours souligné, mais au moins il est coloré en rouge...

[GrandFather]

J'ai trouvé la cause du problème. En tête de ma page j'avais ce code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<p>
  <span style="text-decoration: none; "/>
</p>

J'ai remplacé ce code par un simple

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<p />

Et tout fonctionne, ne sont soulignés que les portions de texte avec un style local. Le problème venait très certainement du fait qu'il n'y avait pas d'espace entre les guillemets de fermeture et le /. IE considérait donc que la balise <span> n'était pas fermée, et que toutes les autres balises étaient donc des balises filles qui héritent du style de celle-ci. En résumé, je me suis fait avoir comme un bleu...
Merci à vous deux.

[EDIT] le W3C préconise d'employer <p> </p> plutôt que <p /> pour assurer la compatibilité XHTML/HTML