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
}