Klasse im Link

[Ansgar]

Für eine Intranetseite habe ich versucht eine Navigation mit CSS Kästen zu erstellen.
In CSS wird eine durchsichtige Box definiert, welche den Text für den Link enthält.
Bei :hover soll die ganze Box braun werden und als anklickbarer Link dienen.

Das gewünscht Verhalten habe ich auch mit der ersten unten stehenden Box erreicht (Bücher). Schade nur, dass die Validierung hierfür fehlschlägt.
Akzeptiert wird die zweite Schreibweise, nur dass dann lediglich der Text als Link anklickbar ist und nicht mehr die ganze Box.
Deshalb vermute ich, dass ich mit meinem Ansatz total auf dem Holzweg bin.

Ich bin Architekt und kein Web-Publisher. Also habt etwas Nachsicht und versucht bei den Erklärungen nicht unnötig fachchinesisch zu schreiben.
Eigentlich könnte mir die Validierung schnuppe sein, da es sich ja nur um eine Intranetseite mit überblickbaren Betriebssystemen und Browsern handelt. Aber wenn es sicher machen lässt, wäre das schon sehr schön.

Also zuerst die relevanten Stellen beim .css
Dann die zwei Boxen im xhtml 1.0 strict

.navigation_1_1 {
   background-color: transparent;
   margin: 0;
   text-align: left;
   width: 145px;
   height: 16px;
   padding: 0;
   top: 0;
   left: 0;
   position: static;
   border: 0;
  }
.navigation_1_1:hover {
   background-color: #E6E4DB;
   }
a:link {
   color: #000000;
   text-decoration: none;
   }
a:hover {
   color: #8D7C64;
   background-color: #E6E4DB;
   text-decoration: none;
   border: none;
   }

<a href="Buecher/index.html"><div class="navigation_1_1">B&uuml;cher</div></a>
<div class="navigation_1_1"><a href="Musik/index.html">Musik</a></div>

Vielen Dank für eure Hilfe