pto: Hintergrundfarbe bei hover über ganze Breite

Beitrag lesen

Hallo, ich habe jetzt die Hintergrundfarbe meiner Navigationspunkte bei hover nur rund um den li-Text aber nicht über die ganze li-Breite. Wie bekomme ich ihn in Listenpunktbreite. Hier mein css:

* {  
 margin:0;  
 padding:0;  
  
 text-decoration:none;  
}  
  
  
  
ul#navi  {  
    position: absolute;  
   float:left;/*  
  background:#990000;*/  
  width:100%;   /* geändert von 150px auf 100% */  
  min-width:80% !important;  
/*  overflow: hidden;*/  
}  
  
ul#navi a {  
 /*display: inline;  
 padding:14px 5px 15px 14px;  
 */  
  
  
 color:#000;  
 font-weight:bold;  
 text-align:left;  
}  
  
.aktiv  
{background: #fff;}  
  
ul#navi li  {  
    list-style:none;  
 position:relative;  
 float:left;  
  
 /* hinzugefügt um eine horizontale Ausrichtung zu erzielen */  
/* width:10.975em                   Hinzugefügt 150px / 16 = 9.375em*/  
 width: 9.375em;  
}  
  
/* Alle Ebenen ausblenden */  
  
ul#navi ul  ,  
ul#navi  li:hover ul ul ,  
ul#navi  li:hover  ul ul ul  {  
    list-style:none;  
 position:absolute;  
 left:-9999px;  
 background:#000;  
}  
  
ul#navi  li:hover ul {  
    list-style:none;  
         background:#d8d8d8;  
       border-left:1px solid #fff;  
          border-top:1px solid #fff;  
          border-right:1px solid #fff;  
          border-bottom:1px solid #fff;  
  
}  
  
ul#navi  li:hover ul ul {  
    list-style:none;  
  background:#929292;  
  
}  
  
ul#navi  li:hover ul ul ul {  
    list-style:none;  
  background:#696969;  
}  
  
ul#navi ul {  
    list-style:none;  
 top:auto;                    /* Neue Position definiert 16px Schriftgröße + (2 x 5px) padding = 30px / 16 = 1.875em*/  
}  
  
  
/* Einzelne Ebenen einblenden */  
ul#navi li:hover ul  {  
 left:0;  
 }  
  
  
                                 /* Neuer Deklarationsblock um die Unterpunkte präzise zu positionieren */  
ul#navi ul  li:hover  ul ,  
ul#navi ul  ul li:hover  ul  {  
 position:absolute;  
 left:100%;  
 top:0;  
 }  
  
ul#navi li:hover ul li {  
     border-top:1px solid #fff;;  
  
 }  
  
/* Hover Hinter- und Vordergrundfarbe für alle Ebenen */  
ul#navi li:hover > a , ul#navi  ul li:hover  > a, ul#navi ul  ul  li:hover  > a, ul#navi ul  ul ul  li:hover  > a  {  
  background:#a33;  
  color:#fff;  
}  
  
ul#navi a span {  
 float:right;  
  font-weight:normal;  
  
Dank und Gruß  
pto  
  }