Probleem met actieve link in andere browser dan IE

[dilama32]

Ik zit met een probleempje waar ik niet helemaal (helemaal niet) uit kom.
Voorbeeld draait hier: http://www.vanimedia.nl/tmp/linktest10/index.html

Ik heb de volgende stijl aangemaakt voor linkjes:

a:link {
color: #666666;
}
a:hover {
color: #FF0000;
}
a:visited {
color: #666666;
}
a:active {
color: #FF0000;
}

Het is de bedoeling dat de actieve link een kleurtje krijg (rood in dit voorbeeld) zodat je ziet op welke link er geklikt is (en waar je dus bent).

In Internet Explorer werkt dit (actieve linkje wordt rood) maar in andere browsers (Chrome, Safari, Firefox, …) werkt dit niet. Is dit eenvoudig op te lossen of doe/denk ik iets fout?

Alvast bedankt voor het meedenken!

 

[keej]

Gebruik

a:focus {
color: #FF0000;
}

in plaats van :active active mag je mss best ook laten staan, maar deze kleur wordt eigenlijk enkel toegepast wanneer de gebruiker op de link klikt).

 

[Goeroeboeroe]

Volgens de standaard is :active als je de muis ingedrukt houdt, en :focus als iets focus heeft, bijvoorbeeld een invoerveld, of een link waar je met de tab-toets naartoe bent gegaan.
Internet Explorer 6 en 7 (en 8?) hebben foutief :active en :focus gecombineerd en :active genoemd.
De meeste andere browsers doen het correct: active: als je de muis indrukt, :focus als 'n link focus heeft.
Het beste kun je :active én :focus gebruiken, dan werkt het in alle browsers zoals je zou verwachten.

 

[peter vazed]

a:link {
color: #666666;
}
a:hover {
color: #FF0000;
}
a:visited {
color: #666666;
}
a:active {
color: #FF0000;
}

LoVe/HAte
staat voor volgorde:
link, visited, hover active

a:link {
color: #666666;
}
a:visited {
color: #666666;
}
a:hover {
color: #FF0000;
}
a:active {
color: #FF0000;
}

 

[keej]

De volgorde staat hier fout, maar wel goed op de website. Maar met :focus moet het wel lukken.
Dus dan

a:link {
color: #666666;
}
a:visited {
color: #666666;
}
a:focus {
color: #FF0000;
}
a:hover {
color: #FF0000;
}
a:active {
color: #FF0000;
}

 

[dilama32]

Allen hartelijk bedankt voor het meedenken, het werk perfect nu! Voorbeeld staat hier:
http://www.vanimedia.nl/tmp/linktest11/

Het ging om deze toevoeging (dank keej)
a:focus {
color: #FF0000;
}

Dus met deze stijlen ben ik er:

a:link {
color: #666666;
}
a:visited {
color: #666666;
}
a:focus {
color: #FF0000;
}
a:hover {
color: #FF0000;
}
a:active {
color: #FF0000;
}

Erg blij mee!