ul ul ul ul: wie kann ich nur die zweit ul ansprechen

[Andrea]

wie kann ich nur die zweit ul ansprechen, wenn ich eine verschachtelte Liste habe

Wenn ich bei vier ebenen ul ul ul ul die zweite anspreche möchte,

und

ul ul {colo:r#ff0000}

hinterlege, wird dies auch auf

ul ul ul  und ul ul ul ul

ausgegeben!

[Matthias Apsel]

Om nah hoo pez nyeetz, Andrea!

wie kann ich nur die zweit ul ansprechen, wenn ich eine verschachtelte Liste habe

Wenn ich bei vier ebenen ul ul ul ul die zweite anspreche möchte, und
ul ul {colo:r#ff0000}
hinterlege, wird dies auch auf
ul ul ul  und ul ul ul ul

Der Selektor foo bar spricht alle Elemente bar an, die Nachfahren eines Elements foo sind.

Du suchst den Kindselektor. http://wiki.selfhtml.org/wiki/CSS/Selektoren/Kombinator

Matthias

[Andrea]

Aber wie mache ich das wenn ichz.B. genau

diese

hier-1
hier-2
hier-3

ansprechen will, ohne das ich dies mit class mache

ul ul  
  
ul ul li:first-child  
  
ul ul li:last-child

funktioniert nicht.

<ul>  
	<li>  
	<ul class="hier-1">  
		<li class="hier-2">  
		</li>  
		<li class="hier-3">  
		<ul>  
		<li>1</li>  
		<li>2</li>  
		<li>3</li>  
		</ul>  
		</li>  
	</ul>  
	</li>  
</ul>

[T-Rex]

hat dir Matthias doch geschrieben "KINDSELEKTOR"

ul > ul  
ul > ul > li  
ul > ul > li:first-child  
ul > ul > last-child  

Gruß
Popoabwischer
T-Rex

[Gunnar Bittersmann]

@@T-Rex:

nuqneH

ul > ul

Selektiert nichts … (wenn das Markup nicht kaputt ist)

ul > ul > li
ul > ul > li:first-child
ul > ul > last-child

… demnach auch nichts.

Popoabwischer

Das hast du aber etwas übriggelassen. ;-)

Qapla'

[Gunther]

Hallo Andrea!

Aber wie mache ich das ...

Lesen und verstehen: http://wiki.selfhtml.org/wiki/CSS/Selektoren

Das heißt hier nicht umsonst "SELF..."!

Gruß
Gunther

[Der Martin]

Hi,

wie kann ich nur die zweit ul ansprechen, wenn ich eine verschachtelte Liste habe

Wenn ich bei vier ebenen ul ul ul ul die zweite anspreche möchte, und
ul ul {colo:r#ff0000}
hinterlege, wird dies auch auf
ul ul ul  und ul ul ul ul

Der Selektor foo bar spricht alle Elemente bar an, die Nachfahren eines Elements foo sind.
Du suchst den Kindselektor. http://wiki.selfhtml.org/wiki/CSS/Selektoren/Kombinator

hilft hier nicht, oder doch? Wenn ja, wie?

Wollte man den Kindselektor benutzen, müsste man die dazwischenliegenden li-Elemente noch berücksichtigen, also ul>li>ul. Aber ul ul passt ja ebenso wie ul>li>ul auch auf das ul-Element der dritten Schachtelungsebene - dieses ist schließlich ein Nachfahre des ul der zweiten Schachtelungsebene.

Spontan fiele mir ein, Eigenschaften für ul ul zu definieren, und für ul ul ul explizit wieder zu überschrieben. Das ist aber irgendwie unbeholfen.

Ciao,
 Martin

[ChrisB]

Hi,

Du suchst den Kindselektor. http://wiki.selfhtml.org/wiki/CSS/Selektoren/Kombinator

hilft hier nicht, oder doch? Wenn ja, wie?

Wollte man den Kindselektor benutzen, müsste man die dazwischenliegenden li-Elemente noch berücksichtigen, also ul>li>ul. Aber ul ul passt ja ebenso wie ul>li>ul auch auf das ul-Element der dritten Schachtelungsebene - dieses ist schließlich ein Nachfahre des ul der zweiten Schachtelungsebene.

Vor der ersten ul wird es wohl irgendein weiteres Element geben (und wenn es „nur“ body ist).

Und Kind von diesem Element ist nur die erste ul, die weiteren nicht mehr …

MfG ChrisB

[Der Martin]

Hallo,

hilft hier nicht, oder doch? Wenn ja, wie?
Vor der ersten ul wird es wohl irgendein weiteres Element geben (und wenn es „nur“ body ist).
Und Kind von diesem Element ist nur die erste ul, die weiteren nicht mehr …

ah, stimmt. Danke!
Hatte gar nicht daran gedacht, dass man sich ja auch am Elternelement der äußeren Liste orientieren kann.

Ciao,
 Martin

[Gunnar Bittersmann]

@@ChrisB:

nuqneH

Vor der ersten ul wird es wohl irgendein weiteres Element geben (und wenn es „nur“ body ist).
Und Kind von diesem Element ist nur die erste ul, die weiteren nicht mehr …

Keine gute Idee.

Womöglich möchte man das Markup später ändern und den Inhalt in ein main- oder section-Element tun, und schon passt body>ul nicht mehr.

Besser, wenn die Listen (zumindest die äußerste) IDs oder Klassen haben, anhand derer sie sich formatieren lassen.

<body>  
  <main role="main">  
    <ul class="outmost-list">  
      <li>  
        <ul>

lässt sich auch bei Ergänzung von main immer noch mit .outmost-list>li>ul selektieren.

Qapla'