X010: "Verschachtelung" von CSS

Hallo,

ich stehe grade ganz gewaltig auf dem Schlauch...

Folgendes, ich habe eine Navigation, mit Subnavigation bei manchen Menupunkten.

Das ganze ist durch verschachtelte Listen gelöst.

Also:

<ul id="navigation">
     <li><a href="beispiel">Topic 1</a>
          <ul>
               <li><a href="#">Topic 1 a</a></li>
               <li><a href="#">Topic 1 b</a></li>
               <li><a href="#">Topic 1 c</a></li>
          </ul>
     </li>
     <li>diverste andere Topics 2, 3,...</li>
</ul>

So. Nun wurde den Hauptpunkten ein Style mit CSS zugewiesen, um genau zu sein dem a-Link

der Selektor heißt

ul#navigation li a
{diverses css}

Dieser betrifft natürlich auch die Topics 1a, 1b, 1c.

Die sollen aber anders aussehen! Deswegen habe ich versucht ihnen mit dem Selektor

ul#navigation li ul li a
{diverses css}

ein anderes Aussehen zu geben. Klappt aber nicht. Die angaben von
ul#navigation li a überschreiben diese scheinbar. ul#navigation li ul li a wird komplett ignoriert!

Wo ist mein Denkfehler?

von der Reihenfolge her, ul#navigation li a kommt im CSS-File vor ul#navigation li ul li a, da das ganze ja von oben nach unten abgearbeitet wird (soweit ich weiß).

Ich bin ratlos.

Würde mich freuen wenn mir jemand erklären kann wo mein Denkfehler ist.

Das müsste doch so funktionieren! Ich möchte nun ungern jedem Subtopic eine Extrawurst-class verpassen.

:(

Seit ich diese Hirarchie-Sache entdeckt habe bin ich da echt Fan von.
Aber offenbar habe ich es nicht verstanden...

Vielen Dank udn ein schönes Restwochenende!

  1. Hab mich mich dem Problem selber gelöst...

    mit :link und :visited klappt es wie gewünscht.

    Böse Falle bei Links, immer wieder...

    Aber irgendwie bin ich der Meinung auch ohne Pseudoklasse sollte das ffunktionieren.

    Wenn mir das jemand erklären mag, nur zu!
    ;)

    1. Hallo!

      Hab mich mich dem Problem selber gelöst...

      Ich hoffe, dass Du das nicht getan hast!

      GG

      --
      "If I do not seek to understand what is happening here
      - then I've got peanuts in my head!"
      (I. Hosein)
    2. @@X010:

      nuqneH

      Aber irgendwie bin ich der Meinung auch ohne Pseudoklasse sollte das ffunktionieren.

      Der Meinung bin ich auch.

      Wenn mir das jemand erklären mag, nur zu!

      Das kann wohl niemand erklären, denn aus dem von dir gezeigtem Code geht nicht hervor, warum das nicht gehen sollte. Verlinke doch mal die fraglich Seite!

      Qapla'

      --
      Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)
    3. hi,

      Wenn mir das jemand erklären mag, nur zu!

      Das nicht, aber einen kleinen Tip:

      #navigation a  
      #navigation ul a
      

      Dein Problem betrifft ja nur die Farbe der Links, diese kannst du auch mit !important im 2. Selektor „erzwingen“.
      Was du auch testen könntest, wäre

      <ul id="navigation">  
           <li><a href="#">Topic 1</a>  
        
                <ul id="navigation-tree-1">  
        
                     <li><a href="#">Topic 1 a</a></li>  
                </ul>  
           </li>  
           <li>Topics 2</li>  
      </ul>
      

      Und dann direkt die verschachtelte Liste #navigation-tree-1 stylen.
      So sparst du dir lange Selektorschlangen, wenn deine Listen mal tiefer verschachtelt werden.

      mfg

      1. #navigation a

        #navigation ul a

        
        >   
        > Dein Problem betrifft ja nur die Farbe der Links, diese kannst du auch mit !important im 2. Selektor „erzwingen“.  
          
        Warum, die Spezifität im zweiten Selektor ist in jedem Fall höher - ein !important ist hier absolut unsinnig.
        
        1. hi,

          Warum, die Spezifität im zweiten Selektor ist in jedem Fall höher - ein !important ist hier absolut unsinnig.

          Da wir die Umstände nicht genauer kennen, war dass nur ein Tipp am Rande. Ich kann das Problem auch nicht nachvollziehen, aber wenn es halt besteht, kann man es mit !important in den Griff bekommen.

          mfg