• Das kreative Thema des Monats Oktober wird vor allem diejenigen unter Euch besonders ansprechen, denen Do-it-yourself quasi im Blut liegt. Zeigt uns Eure Improvisationskünste oder fotografiert, was andere Leute sich so im Alltag zusammengestrickt haben. --> Zum Mitmachen bitte hier klicken

[CSS] CSS Textfarbe bei Verschachtelung

Mini-Leopard

Rhode Island Greening
Registriert
20.03.08
Beiträge
476
Liebe Community!

Ich versuche gerade bei einem verschachtelten Elemente-System nur das übergeordnete anzusprechen.
Dieses hat die id "current" und soll dadurch eine andere Schriftfarbe bekommen.

Wenn ich dieses Element anweise, dann erben leider alle dort enthaltenen Elemente auch die andere Schriftfarbe.
Das sieht ungefähr so aus:


HTML:
Code:
<ul class="menu">
    <li>
        <a>
            <span>eins</span>
        </a>
    </li>
    <li id="current">
        <a>
            <span>zwei</span>
        </a>
        <ul>
            <li>
                <a>
                    <span>zwei eins</span>
                </a>
            </li>
        </ul>
        <ul>
            <li>
                <a>
                    <span>zwei zwei</span>
                </a>
            </li>
        </ul>
    </li>
    <li>
        <a>
            <span>drei</span>
        </a>
    </li>
</ul>


CSS:
Code:
#current a span
{
  color:#00ff00;
}


Damit habe ich doch eigentlich durch meine Strunktur (also der span vom a vom #current) die anderen Unterpunkte (also der span vom a vom ul vom #current) ausgegrenzt, oder sehe ich das grundlegend falsch? Welche Möglichkeit habe ich da jetzt?!


Liebe Grüße und herzlichen Dank für jede Hilfe!
…
 
Zuletzt bearbeitet:
Soweit ich weiss ist Span veraltet, warum benutzt du keine DIV Container ?
 
Zuletzt bearbeitet:
Das obliegt leider nicht meiner Entscheidung, da die Struktur durch ein CMS aufgebaut wird.
Allerdings ist die Wahl des Tags in dem Fall auch nicht relevant, da es ja eher eine prinzipielle Frage zum Selector Syntax ist.

Oder natürlich, wie man mein Problem lösen kann.
Das ist es ja aber mit der Verwendung eines div's anstelle eines span's nicht.
 
Entweder nur für die erste Ebene deklarieren (gibt evtl. Probleme in älteren Browsern):
Code:
#current > a span {
   color:#00ff00;
}
oder die zweite Ebene überschreiben:
Code:
#current ul a span {
   color: #ff0000;
}

In deinem "ul" fehlt übrigens das "li", aus welchem CMS kommt denn solcher Code?
 
  • Like
Reaktionen: Mini-Leopard
Wird gleich mal getestet, danke.
Richtig, Harniball… Das li hatte ich schlicht vergessen (aus dem Kopf abgeschrieben). Aber sonst stimmt der Code.
Ich werde die Verbesserung sofort vornehmen.
Der Code entspringt Joomla!

Melde mich wieder, wenn ich's getestet habe.
 
@ Harniball:

Mal riesigen Dank!

Hat super geklappt und alles ist in Ordnung.
Habs irgendwie nicht richtig gecheckt.

Einmal Code pasten, sichern, Safari neu laden und fertig!
Einfach richtig spitze.

Vielen Dank!
 
Zuletzt bearbeitet: