Hallo Zusammen,
CSS mag mich mal wieder nicht...
Ich habe ein horizontales Menü mit drei Ebenen, die per hover angezeigt werden. Die zweite Ebene funktioniert auch super.
Der css code der 3. Ebende ist eine 1:1 Kopie der 2. Ebene, nur mit level_3. Funktioniert auch. Wird alles sauber formatiert. Habe die Ebene testweise dauerhaft eingeblendet und die Farben geändert. Hat funktioniert.
Es wird halt nur nicht eingeblendet. Weiß jmd. was ich da übersehe?
Danke,
Stefan
Code:
/* ======================================
Horizontale Navigation – Zweite Ebene
====================================== */
/*Ebene ausblenden*/
#header .mod_navigation .level_2 {
width: 0;
height: 0;
position: absolute;
left: -32786px;
top: -32768px;
overflow:hidden;
display: inline;
}
/*Ebene bei mouseover anzeigen*/
#header .mod_navigation li:hover .level_2 {
width: auto;
height: auto;
left: auto;
top: auto;
overflow:hidden;
display: block;
z-index: 1000;
}
/*Ebene design*/
#header .mod_navigation .level_2 li{
margin-right:10px;
border: 1px solid #89adcd;
}
#header .mod_navigation .level_2 a{
font-weight:normal;
}
#header .mod_navigation .level_2 span.active{
font-weight:bold;
}
#header .mod_navigation .level_2 .active,
#header .mod_navigation .level_2 .trail {
font-weight:bold;
color: #E2001A;
}
#header .mod_navigation .level_2 a:hover,
#header .mod_navigation .level_2 a:focus {
font-weight:bold;
}
/* ======================================
Horizontale Navigation – Dritte Ebene
====================================== */
/*Ebene ausblenden*/
#header .mod_navigation .level_3 {
width: 0;
height: 0;
position: absolute;
left: -32786px;
top: -32768px;
overflow:hidden;
display: inline;
}
/*Ebene bei mouseover anzeigen*/
#header .mod_navigation li:hover .level_3 {
width: auto;
height: auto;
left: auto;
top: auto;
overflow:hidden;
display: block;
z-index: 1000;
}
/*Ebene design*/
#header .mod_navigation .level_3 li{
margin-right:10px;
border: 1px solid #89adcd;
}
#header .mod_navigation .level_3 a{
font-weight:normal;
}
#header .mod_navigation .level_3 span.active{
font-weight:bold;
}
#header .mod_navigation .level_3 .active,
#header .mod_navigation .level_3 .trail {
font-weight:bold;
color: #E2001A;
}
#header .mod_navigation .level_3 a:hover,
#header .mod_navigation .level_3 a:focus {
font-weight:bold;
}
Lesezeichen