DK: Link breiter als Text

Beitrag lesen

Hey,

ich habe eine Seite mit einem Navigationsmenü, bei dem sich die Hintergrundfarbe ändert wenn man darüber fährt.

  
<div class="menu">  
 <ul>  
   <li><a href="index.php"><div>Startseite</div></a></li>  
   <li><hr></li>  
   [...]  
 </ul>  
</div>  

Das Ganze hab ich als eine Liste definiert.
Die <li>-Elemente haben alle eine feste Größe.

Das Problem:

Ich hab hinter dem <a>-Element noch ein <div>-Element eingeschoben um den Link-Bereich auf die selbe Breite wie das <li>-Element zu bekommen.

Das ist allerdings nicht-valides HTML (,da ein block-Element sich im inline-Element befindet).

Wie könnte ich das umgehen und den Link trotzdem auf die richtige Breite und Höhe bekommen?

  
<div class="menu">  
 <ul>  
   <a href="index.php"><li>Startseite</li></a>  
   <li><hr></li>  
   [...]  
 </ul>  
</div>  

Würde ja auch nicht gehen da dann das <a>-Element in einem <ul>-Element stecken würde.

Schonmal danke für eure Hilfe.
Dennis