Maetzzen: CSS Pseudoclass :active / :focus

Beitrag lesen

Guten Morgen zusammen! Ich hätte mal wieder eine Frage und zwar wird bei meiner Navigations-Liste immer das überflogene <li> Element hervorgehoben. Nun wäre es toll, wenn dieses Element die css-styles nicht nur bei :hover sondern auch nach dem klicken behält.

Hier ein fiddle dazu.

Wenn ich die href der <a>-Links mit meinen verschiedenen *.php Seiten verlinke, wird die rote Schrift nicht beibehalten. Wenn ich nach dem *.php im href noch eine # hinzufüg (also *.php#) Dann funktioniert es, aber nur wenn man ein zweites Mal auf den Link drückt :)

Gibt es hierfür eine Lösung? Schlussendlich sollen die css-styles von #navigation li:hover für das jeweils aktive Element angezeigt werden (also der Graue Rahmen + Hintergrund). Das andere dient nur um das Problem zu erläutern

Gruß Maetzzen

EDIT: Also Sobald eine neue Seite geladen wird, verschwindet der "style" wieder. Wenn ich auf der Seite bleibe und nur mit # nach oben scroll, funktioniert es..