/CSS: li in li? Einfaches dumm gefragt.

[Rätselknacker]

Irgendwie stehe ich auf dem Schlauch.

In der Liste der HTML-Elemente steht etwas anderes als in den ausführlichen Beistpielen und deren Erklärungen.

Zum einen heißt es:
"Zwischen <li> und </li> darf eine komplette weitere Liste stehen. Auch andere Listentypen sind dabei erlaubt."

Ok.

In der Element-Referenz steht:

"li:
[...]
2. bei ol und ul:
[Block-Elemente] | [Inline-Elemente]"

Das bedeutet doch ich kann folgendes tun:

<ul>
   <li><a href="#a">a</a></li>
   <li>Peter</li>
   <li><img src="URL"></li>
   <li>
      <li>1</li>
      <li>9</li>
      <li>B</li>
   </li>
   <li>Hase</li>
</ul>

die li's im li sind ja Inline-Elemente. Also erlaubt. oder doch verboten?

Alle Beispiele von verschachtelten Links nutzen aber eine weitere ul im li. Wieso?

Mein Problem ist u. a. dass:

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

dazu führt dass ein <p></p> nach er Liste nicht mehr das margin hat. ähm wie soll ich es erklären...

wenn ich die innere ul weg lasse hat ein <p></p> der nach der Liste kommt den korrekten Abstand, unter dem letzten li.

Verschachtel ich zwei ul's fehlt der Abstand, bzw Opera und Firefox scheinen den Abstand vom ersten li aus zu setzen. Ich würde erwarten dass der Abstand zum letzten li gehalten wird.

Wenn ich den Blockelementen mit CSS eien Outline gebe sind li's der inneren ul ausserhalb der Outline.

Keine Ahnung ob man versteh was ich meine...

[Christoph Schnauß]

hallo,

die li's im li sind ja Inline-Elemente. Also erlaubt. oder doch verboten?

Verkehrt gedacht. <li> ist nicht ohne <ul> oder <ol> möglich (<dir> und <menu> lassen wir mal außen vor).

Alle Beispiele von verschachtelten Links nutzen aber eine weitere ul im li. Wieso?

Damit es valide wird.

Mein Problem ist u. a. dass:
<ul>
   <li>
      <ul>
         <li></li>
      </ul>
   </li>
</ul>
dazu führt dass ein <p></p> nach er Liste nicht mehr das margin hat. ähm wie soll ich es erklären...

Irgendwie so, daß man versteht, was du meinst.

Wenn du Listen verschachteln willst, geht das so:

<ul>  
<li>...</li>  
<li><ul>  
    <li>...</li>  
    </ul>  
</li>  
</ul>

Grüße aus Berlin

Christoph S.

[Gunnar Bittersmann]

Hello out there!

In der Liste der HTML-Elemente steht etwas anderes als in den ausführlichen Beistpielen und deren Erklärungen.

Nein.

Zum einen heißt es:
"Zwischen <li> und </li> darf eine komplette weitere Liste stehen. [...]"

Eine _komplette_ Liste, aha.

In der Element-Referenz steht:

"li:
[...]
2. bei ol und ul:
[Block-Elemente] | [Inline-Elemente]"

Und was lehrt dich der Click auf "Block-Elemente"? Ist 'li' denn ein solches?

Das bedeutet doch ich kann folgendes tun:

<ul>
   <li><a href="#a">a</a></li>
   <li>Peter</li>
   <li><img src="URL"></li>
   <li>
      <li>1</li>
      <li>9</li>
      <li>B</li>
   </li>
   <li>Hase</li>
</ul>

Ist

         <li>1</li>  
         <li>9</li>  
         <li>B</li>

denn eine _komplette_ Liste?

die li's im li sind ja Inline-Elemente.

Hä??

Also erlaubt. oder doch verboten?

Natürlich letzteres.

Im Zweifelsfalle ist nicht SELFHTML _die_ Referenz, sondern die HTML-Spec [HTML401]

In der DTD [HTML401 §21, DTD] findest du:

<!ELEMENT LI - O (%flow;)* -- list item -->

'flow' wurde vorher definiert als (Link folgen):

<!ENTITY % flow "%block; | %inline;">

'block' wurde vorher definiert als (Link folgen):

<!ENTITY % block  
     "P | %heading; | %list; | %preformatted; | DL | DIV | NOSCRIPT |  
      BLOCKQUOTE | FORM | HR | TABLE | FIELDSET | ADDRESS">

'list' wurde vorher definiert als (Link folgen):

<!ENTITY % list "UL | OL">

Alle Beispiele von verschachtelten Links nutzen aber eine weitere ul im li. Wieso?

Die Antwort kannst du dir jetzt selbst geben.

Mein Problem ist u. a. dass: [...]
Verschachtel ich zwei ul's fehlt der Abstand, bzw Opera und Firefox scheinen den Abstand vom ersten li aus zu setzen. Ich würde erwarten dass der Abstand zum letzten li gehalten wird.

Von collapsing margins [CSS2 §8.3.1] hast du schon gehört?

See ya up the road,
Gunnar

[MudGuard]

Hi,

Im Zweifelsfalle ist nicht SELFHTML _die_ Referenz, sondern die HTML-Spec [HTML401]

Im Zweifelsfall ist auch nicht irgendeine Übersetzung _die_ Referenz, sondern das Original

cu,
Andreas

[MudGuard]

Hi,

Das bedeutet doch ich kann folgendes tun:

Nein.

<ul>
   <li><a href="#a">a</a></li>
   <li>Peter</li>
   <li><img src="URL"></li>
   <li>
      <li>1</li>
      <li>9</li>
      <li>B</li>

In HTML ist bis hierhin alles korrekt. Dein ul hat 7 list-items (wobei das vierte leer ist, in HTML ist das schließende tag für li optional)

</li>

Hier schließt Du allerdings ein li, obwohl gar keines offen ist.

In XHTML sieht's anders aus, da gibt es keine optionalen schließenden Tags, daher ist hier schon das <li>1</li> falsch.

cu,
Andreas