CSS - ich hasse es...

C

CentralWay

0
Hallo,
auch wenn CSS natürlich sehr nützlich ist verschwende ich unglaublich viel Zeit mit dem Zeugs. Aktuelles Beispiel;
ich habe eine Webseite, auf der es zwei Link-Arten gibt. Beide reagieren genau gleich, aber bei der einen Link-Klasse ist die Schriftart grösser als beider anderen.

es gibt:
<a class="links" ...>
und <a class="links2"...>

Mein Css sieht so aus:
Code: 
<style type="text/css">
a:link { color: #000000; text-decoration:none; }
a:active { color: #000000; text-decoration:none; }
a:visited {color: #000000; text-decoration:none; }
a:hover { color: #838B8B; text-decoration:none; }
body { background-color:#D6D6D6; font-family:Arial; font-size:12px; }
.links {background-color:#4169E1; font-weight:bold; font-family:Arial; font-size:14px;}
.links2 {font-weight:bold; font-family:Arial; font-size:12px;}
.tbmaincontent {background-color:#FFFFFF; font-family:Arial; font-size:12px;}
</style>
Nun ist das Problem, dass die Links erst "richtig", also schwarz und wenn man drüber fährt grau reagieren wenn man sie schon mal angeklickt hat, sie also "visited" sind.

Stimmt die Reihenfolge nicht? Oder wie mach ich das? :-s

Danke, ihr spart mir mit der Lösung noch ein paar graue Haare mehr :p
 
Hallo,

dein CSS lässt sich noch etwas kürzen. Dann fällt auch a:link und a:visited weg, falls es identisch zu a ist.

Code: 
<style type="text/css">
a { color: #000000; text-decoration:none; font-weight:bold; font-family:Arial; }
a:hover { color: #838B8B; }
body { background-color:#D6D6D6; font-family:Arial; font-size:12px; }
.links {background-color:#4169E1; font-size:14px;}
.links2 { font-size:12px;}
.tbmaincontent {background-color:#FFFFFF; font-family:Arial; font-size:12px;}
</style>

Probier mal, ob es so besser geht (a:hover und a.links(2) erben alle Eigenschaften von a, du brauchst sie also nicht mehrfach setzen).

Falls es nicht geht: Welcher Browser macht denn Probleme? Hier im Firefox sah es eigentlich ganz gut aus damit ...

mfg, metax.
 
Mit :link würde ich nicht hantieren, das läuft sowieso auf das normale a hinaus. Etwas zusammengekratzt und formatiert sollte es so funktionieren:

Code: 
<style type="text/css">
body {
    background-color:#D6D6D6;
    font-family:Arial, sans-serif;
    font-size:12px;
}

.tbmaincontent {
    background-color:#FFF;
    font-family:Arial, sans-serif;
    font-size:12px;
}

a,
a:visited,
a:active {
    color: #000000;
    text-decoration:none;
    font-weight:bold;
}

a:hover {
    color: #838B8B;
}

.links {
    background-color:#4169E1;
    font-size:14px;
}

.links2 {
    font-size:12px;
}
</style>
 
Um antworten zu können musst du eingeloggt sein.
Zurück
Oben