[Résolu] Listes imbriquées valide xhtml

Salut,

Ma question va vous paraitre un peu bizarre, mais comment fait on pour crééer des listes (ul ou ol) imbriquées qui soient valides xhtml 1.0 strict.

En effet, une des solutions consiste à écrire

<ul>
 <li>element 1</li>
 <li>
  <ul>
   <li>sous_element 1</li>
   <li>sous_element 2</li>
   <li>sous_element 3</li>
  </ul>
 </li>
 <li>element 2</li>
 <li>
  <ul>
   <li>sous_element 1</li>
  </ul>
 </li>
 <li>element 3</li>
</ul>

Les puces du permier niveau (puces noires) ce répetent au niveau de chaque premier sous element (puces entourée en rouge).
Malheurseusement si je crée les listes comme ca :

<ul>
 <li>element 1</li>
  [b]<li>[/b]
  <ul>
   <li>sous_element 1</li>
   <li>sous_element 2</li>
   <li>sous_element 3</li>
  </ul>
 [b]</li>[/b]
 <li>element 2</li>
  [b]<li>[/b]
  <ul>
   <li>sous_element 1</li>
  </ul>
  [b]<li>[/b]

 <li>element 3</li>
</ul>

... la page n'est plus valide xhtml 1.0 strict. (en gras, ce sont les éléments supprimés par rapport au 1er exemple)

Je fais donc appelle à vous pour m'aider à résoudre mon problème

Merci d'avance
Modifié par ymhotepa (16 Sep 2005 - 18:01)

Heu, je dis peut-être une bétise, mais ca pourrait peut-être marché (il me semble avoir déjà du faire comme ca):

<ol>
 <ul>
  <li></li>
  <li></li>
  <li></li>
 </ul>
 <ul>
  <li></li>
  <li></li>
  <li></li>
 </ul>
</ol>

Je l'ai vu écris sur cette page[/url], il y a donc des chances que ca marche (et autant de chances que ca ne marche pas ).

En tout cas, c'est rigolo, mais je ne vois pas énormément de résultats sur Google, pour des listes imbriquées pourtant très utilisée (à mon avis).
Modifié par Sylvain (06 Sep 2005 - 19:17)

Bonjour,

Il manque juste un / de fermeture (ajouté en rouge)

ymhotepa a écrit :
Malheurseusement si je crée les listes comme ca :

<ul>
 <li>element 1</li>
  [b]<li>[/b]
  <ul>
   <li>sous_element 1</li>
   <li>sous_element 2</li>
   <li>sous_element 3</li>
  </ul>
 [b]</li>[/b]
 <li>element 2</li>
  [b]<li>[/b]
  <ul>
   <li>sous_element 1</li>
  </ul>
  [b]<[#red]/[/#]li>[/b]

 <li>element 3</li>
</ul>

... la page n'est plus valide xhtml 1.0 strict. (en gras, ce sont les éléments supprimés par rapport au 1er exemple)

Je fais donc appelle à vous pour m'aider à résoudre mon problème

Merci d'avance

en fait, je crois que l'erreur venait de là, ne cherchons pas plus loin...

Merci Monique ! (doit-on crier en choeur, car ce soucis m'interressait aussi car je vais devoir faire ce genre de listes dans peu de temps).

Quand à moi, je vais poser une question un peu différente :
Je ne peux pas mettre d'autres choses que des <li> et des <ul> dans les <ul> ? par exemple, balise <span> ou autre, pour décrire dans une liste de liens quelle liste de lien il s'agit par exemple !

Sylvain a écrit :
Je ne peux pas mettre d'autres choses que des <li> et des <ul> dans les <ul> ? par exemple, balise <span> ou autre, pour décrire dans une liste de liens quelle liste de lien il s'agit par exemple !

Attention : la balise <ul> ne peut contenir directement que des <li> (et non d'autres <ul>)
Par contre, à l'intérieur du <li>, tu peux placer presque n'importe quel élément

Bonjour,

ymhotepa a écrit :
Les puces du permier niveau (puces noires) ce répetent au niveau de chaque premier sous element (puces entourée en rouge).

Il s'agit simplement de la présentation par défaut des listes via les styles CSS des navigateurs (ou mécanisme équivalent). A toi de modifier à ta guise via CSS, passant par une classe haschild pour supprimer la puce de premier niveai pour les éléments li contenant une liste de second niveau.

Autre solution: ne pas imbriquer les listes. Remplacer le premier niveau par les titres <h...> de niveau adapté, selon la hiérarchie des titres dans ta page.
Modifié par Laurent Denis (07 Sep 2005 - 06:01)

Salut à vous tous,

Monique > En fait, les LI qui sont en gras dans mon 2eme exemple sont ceux qui n appraissaient plus par rapport au 1er exemple. C'est juste une erreur de ma part quand j ai copier coller. Ces LI n'etant plus présent l'erreur ne venait pas de là. Je te remercie quand même de ton aide.

Sylvain > Merci à toi aussi pour ton aide

Laurent > Ta méthode de classe dans les "sous UL" marche parfaitement, merci bien. Je n'ai pas essayé la méthode des titre pour les premier niveau, mais à l'occasion, je le ferais.

Raphael > Merci pour ta petite précision conecrnant les UL et LI
Modifié par ymhotepa (07 Sep 2005 - 14:25)

C'est vrai que sémantiquement, c'est mieux de décrire un menu avant la liste <ul> que dedans...
Ma question était stupide...

Donc pas de solution pour faire des listes ordonées !

<ol>
<li>element 1</li>
<li>
<ul>
<li>sous_element 1</li>
<li>sous_element 2</li>
<li>sous_element 3</li>
</ul>
</li>
<li>element 2</li>
<li>
<ul>
<li>sous_element 1</li>
</ul>
</li>

<li>element 3</li>
</ol>