Links formatieren mit css

[Patchie]

Hallo

Ich verstehe mal wieder die Linksachen nicht…

Will in allen Links, außer ein paar wenigen, KEINEN Unterstrich haben. Das habe ich dann so formatiert:

Code: Alles auswählen

a {  text-decoration:none;
    outline: none; /*klappt nicht in allen browsern */
}
a:link { color: #1d577f; }
a:visited { color:#1d577f; }
a:hover, a:focus { color:#F00; }
a:active { color:#f00; }

#navigation a:link { color:#fff; }
#navigation a:visited { color:#fff; }
#navigation a:hover, #navigation a:focus { color:#f00; }
#navigation a:active { color: #fff; }

#rechts a:link { color: #999999 !important; }
#rechts a:visited { color:#999999; }
#rechts a:hover, a:focus { color:red !important;
/*border-bottom: 1px solid red !important;*/
}
#rechts a:active {
   color:red;
}


Bei den wenigen die einen haben sollen will ich es so machen. Klappt aber nicht! Nicht mal mit !important

Code: Alles auswählen

.underline a {   
   text-decoration:underline !important;
}

<p><a href="#" class="underline" title="Erstellt eine pdf-Version der aktuellen Webseite" target="_blank">pdf-Version der Webseite</a></p


Die "Erstellt eine pdf-Version der aktuellen Webseite" soll jetzt mit der "class=underline" einen Unterstrich haben.
Hab immer wieder solche Probleme...
Wenn ich es DIREKT mit einem "style="text-decoration:underline"; " in die Tags schreibe klappt es...
Wo liegt das Problem? !important sollte es doch erzwingen?

[Patchie]

ok, 30 sekunden später selber drauf gekommen...

Code: Alles auswählen

.underline {   
   text-decoration:underline;
}


einfach a weglassen.

ABER wenn ich jetzt die einzelnen Zustände wie link, visited, hover usw. ansprechen will:

Code: Alles auswählen

.underline a:link {   
   text-decoration:underline;
   color:#FF0:
}


geht es wieder nicht.

Es ist und bleibt ein Rätzel...

[Pelix]

Code: Alles auswählen

.underline {   
text-decoration:underline;
}

Code: Alles auswählen

.underline a {   
text-decoration:underline;
color:#FF0:

Sollte funktionieren.

Gruß Pelix

[jack willson]

Zur Not kann man auch jeden Link direkt stylen mit <!--<a href="" style="text-decoration:none'">SAMPLE</a>-->

Natürlich nur, wenn das bei dir so umzusetzen ist.

[Guillermo]

Hi Patchie,

Code: Alles auswählen

.underline a

funktioniert nicht. Du hast deinem Link die Klasse "underline" gegeben. Das was du da aber in CSS formulierst hast spricht ein Element mit der Klasse "underline" an und in diesem Element wird dann nach einem weiteren Element "a" gesucht. D.h. es würde funktioneren wenn dein Aufbau so aussehen würde:

Code: Alles auswählen

<a class="underline"><a>Dein Link</a></a>

Es gibt zwei Arten das für deine Variante zu machen:

Code: Alles auswählen

/* Hiermit werden alle a-Elemente angesprochen die die Klasse "underline" haben */
a.underline { ... }
/* Effekte */
a.underline:hover { ... }
...


Die zweite Variante wäre die gleiche von oben nur jeweils ohne dass "a" am Anfang, das funktioniert auch.

Viele Grüße,
Guillermo

[Patchie]

Yo danke. Hab mir nen Screenshot gemacht, damit ich nciht immer das gleiche frage

Danke!