[hotte1234]

Ich habe folgende Struktur vor, da ich ein CMS Typo3 verwende

<div id="sectionLinks">
Nav Level 1
<div class="next">
Nav Level 2
</div>
</div>

Abschnitt CSS Datei ist angefügt. Die Schrift und der hover werden nicht übernommen. Wer kann mir helfen? Bzw einen Tipp geben.

#sectionLinks{
margin: 0px;
padding: 0px;
}

#sectionLinks h3{
padding: 10px 0px 2px 10px;
border-bottom: 1px solid #cccccc;
}

#sectionLinks a:link, #sectionLinks a:visited {
display: block;
border-top: 1px solid #ffffff;
border-bottom: 1px solid #cccccc;
background-image: url(../Design/bg_nav.jpg);
font-weight: bold;
padding: 3px 0px 3px 10px;
color: #21536A;
}

#sectionLinks a:hover{
border-top: 1px solid #cccccc;
background-color: #69A3BA;
background-image: none;
font-weight: bold;
color: white;
text-decoration: none;
}

.next a:link, .next a:visited {
display: block;
border-top: 1px solid #ffffff;
border-bottom: 1px solid #cccccc;
background-image: url(../Design/bg_nav.jpg);
font-weight: ;
padding: 3px 0px 3px 23px;
color: blue;
}

.next a:hover{
border-top: 1px solid #cccccc;
background-color: blue;
background-image: none;
color: white;
text-decoration: none;
}

[Gumbo]

Der ID-Selektor hat eine höhere Spezifität als der Klassenselektor. Deshalb überschreiben die Regeln mit ID-Selektor die mit den Klassenselektoren.
Eine Möglichkeit wäre also, die Spezifität zu erhöhen, indem du ebenfalls einen ID-Selektor mit angibst, also:

#sectionLinks .next a:link, #sectionLinks .next a:visited {
	…
}

[hotte1234]

Danke vielmals, genau das habe ich gebraucht. Ihr seid Spitze .

Selten so ein schnelle und gute Antwort bekommen.

LG Hotte

[hotte1234]

Danke nochmals Markus!

[Gizmor]

Zitat von Gumbo

Der ID-Selektor hat eine höhere Spezifität als der Klassenselektor. Deshalb überschreiben die Regeln mit ID-Selektor die mit den Klassenselektoren.
Eine Möglichkeit wäre also, die Spezifität zu erhöhen, indem du ebenfalls einen ID-Selektor mit angibst

alternativ gibt es noch !important