HTML : Héritage avec la balise <UL>

J

julieng31

Nouveau membre
Bonjour,

je suis en train de créer un site internet et je suis tombé sur un résultat auquel je ne m'attendais pas et je ne touver aucune réponse.

Un code simplifié est donné en dessous. J'utilise FireFox 2.0.0.1 sous Linux et ce qui est affiché est le mot "Contenu" en bleu mais les mots "choix 1" et "choix 2" sont en noir ! Pourtant, ces derniers ne devraient-ils pas hériter de la propriété color de <p> et donc s'afficher en bleu ? Est ce qu'il y aurait un héritage particulier avec <ul> ?

Code: 
<p>
  Contenu
  <ul>
    <li> choix 1</li>
    <li> choix 2</li>
  </ul>
</p>

avec la CSS :

Code: 
p {
  color:blue;  
}

Merci d'avance pour vos réponses.
 
J

julieng31

Nouveau membre
C'est un test simplifié pour montrer le problème. En fait, tout le code est déjà donné (il n'y a pas d'autres règle).

Je redonne tout, avec les balises HTML :

Code: 
<html>
  <head>
    <title> Test </title>
    <link href="css.css" type="text/css" rel="stylesheet" />
  </head>

  <body>
    <p>
      Contenu
      <ul>
        <li> choix 1</li>
        <li> choix 2</li>
      </ul>
    </p>
  </body>
</html>

Et le fichier CSS :

Code: 
p {
  color:blue;  
}
 
dartyduck

dartyduck

Grand Meuble Suprême
tu ne définis que l'attribut <p>, donc par défaut les <li> sont en noir. Tu dois, dans ton code css, définir les propriétés de tes <li> (et même de ton <ul> si tu veux une couleur différente, ou autre).
Et tu devrais fermer ta balise </p> avant ton <ul> je pense. Comme ça tu dissocies tes balises
Et quand tu donne du code dans tes messages, UTILISE LA BALISE CODE BORDEL DE M.... !!!!!
 
J

julieng31

Nouveau membre
Merci pour cette première réponse (et désolé pour la balise code, je ne suis pas très habitué des forums et je n'avais pas compris à la première fois).

En ayant vu le résultat, j'avais déjà redéfini les propriétés de <li> et ça marche. Dartuduck, le fait de mettre <li> dans <p> me permet d'uniformiser la présentation pour le bloc complet dont <li> fait parti (j'essaye de conserver un bloc pour chaque idée pour avoir le code le plus ordonné possible).

Cependant, je me demande pourquoi <li>, qui est inclu dans <p>, n'hérite pas des propriétés de ce dernier. Est ce que je me trompe dans ma définition de l'héritage, la balise <ul> ou <li> a un héritage particulier ou est ce que c'est FireFox qui a un comportement spécifique (je n'ai pas d'autre navigateur pour tester) ?
 
boub popsyteam

boub popsyteam

Grand Maître
Comme diraient kangol et zeb, merci d'editer tes posts et de mettre les balises [CODE ] et [/CODE ] (bouton "CPP").
 
marsien

marsien

Grand Maître
Tu ne peux pas inclure un <ul> dans un <p>, c'est interdit par le W3C, et ça se comprend. Tu fermes ton paragraphe avant d'ouvrir ta liste. Et tu appliques séparément ton style aux 2 blocs. Si tu veux garder une unité, inclus le tout dans un <div>...

C'est que t'a déjà précisé en partie Dartyduck ;)
 
dartyduck

dartyduck

Grand Meuble Suprême
Et un conseil, installe IE et Opera, en plus de FF. Tu ne peux pas te permettre de développer uniquement sur un seul navigateur. Apres tu comprendras pas quand tes visiteurs soit te diront que ton site est pourri, soit qu'ils resteront pas plus de 2s sur ton site... Les mises en pages ne snt pas forcément uniformes et te demandront des ajustements pour standardiser entre les diff navigateurs.
 
J

julieng31

Nouveau membre
Je suis tout à fait d'accord avec vous, il faut visualiser le résultat avec plusieurs navigateurs. Simplement, temporairement, je n'ai que Firefox (problème de distrib).

Pour revenir au sujet initial, on m'a peut être donné une explication pour le comportement obtenu avec Firefox. En rajoutant du contenu juste après la liste et à l'intérieur de la balise <p></p>, on s'apercoit que la couleur bleue n'est pas appliquée non plus. Apparemment, ce serait Firefox qui fermerait la balise tout seul en voyant la balise <ul>. L'explication remonterait au langage HTML pour lequel les créateurs de site Web oubliait fréquemment de fermer les balises <p> (qui servaient juste de retour a la ligne, ce qui ne devrait plus arriver en XHTML). Donc FF génèrerait lui-même la balise de fermeture quand il rencontre la balise <ul> car, comme l'a dit Marsien, le W3C n'autorise pas l'inclusion <p><ul></p></ul> et le style n'est pas appliqué a la suite (liste et contenu ajouté) de mon code.
 
Vous devez vous inscrire ou vous connecter pour répondre ici.
Dernières actus
Derniers messages publiés
Statistiques globales
Discussions
730 134
Messages
6 718 063
Membres
1 586 394
Dernier membre
Manoushk
Partager cette page
Haut