Schrift-Hover-Effekt bei <li>-Hover-Effekt gleichzeitig

[Gunnar Bittersmann]

Hello out there!

Die Seite mit der Navigation links:
http://server-r005.hostpoint.ch/~lenherr/lang_de/index.php

Verweise einbinden.

Gibt es irgendeine Möglichkeit, den Link-Bereich anders zu vergrössern?

Ja, wie [imho_tep] schon sagte: .navi a {display: block}

Das solltest du auch *unbedingt* tun, denn für den Benutzer ist es verwirrend, wenn er mit dem Mauszeiger in der 'li'-Box ist und diese die Farbe ändert, beim Click aber nichts passiert, weil er nicht in der 'a'-Box ist.

Oder gibt es eine Möglichkeit, die Hover-Effekte zu verknüpfen?

Ja, du solltest die Wechsel von Text- und Hintergrundfarbe auf dasselbe Element beziehen; also nicht den einen auf 'li', den anderen auf 'a'; sondern beide entweder auf 'li' oder auf 'a'. Da IEs zu blöd für 'li:hover' sind, fällt die Möglichkeit weg. Also:

.navi a {  
  display: block;  
  background-color: #D1B946;  
  color: #004E96;  
}

(Mit dem Nachfahrenselektor bist du vertraut? [CSS2 §5])

Dann könntest du auch den Code entschlacken, er krankt an Divitis [Wikipedia]. Und besonders umfangreiche Stylesheets (Warum hast du eigentlich mehrere 'style'-Elemente?) sollten in eine externe Datei ausgelagert werden [SELFHTML]; dann müssen der ganze Code nur einmal zum Client übertragen werden, außerdem Änderungen für alle Seiten der Site nur an einer Stelle vorgenommen werden.

See ya up the road,
Gunnar