Påvirk parent element i en css menu
Jeg sidder og roder med noget CSS og mangler en guide til at påvirke øverste element fra underliggende elementer.Altså forstået på den måde, at når jeg bevæger ned i drop-down delen, så skal hoved-menu-punktet kunne påvirkes. I nedenstående eksempel, "slukker" øverst element når jeg bevæger mig ned i menuen.
se: http://schubertsminde.dk/_ny/indhold.asp?id=32
Her er min css-kode:
.layout_01 #menu {
height:32px;
width:1000px;
background:#FFF;
border-bottom:1px solid #000;
float:left;
}
.layout_01 #menu .afstand {
padding-left:260px;
}
.layout_01 #menu ul {
font-family: Arial, Verdana;
font-size: 14px;
margin: 0;
padding: 0;
list-style: none;
font-variant:small-caps;
font-weight:bold;
}
.layout_01 #menu ul li {
display: block;
position:static;
float: left;
}
.layout_01 #menu li ul { display: none; }
/* Her sætter jeg layout for menupunkter på topniveau */
.layout_01 #menu ul li a {
display: block;
text-decoration: none;
color: #000;
padding: 9px 8px 8px 8px;
white-space: nowrap;
}
/* Her sætter jeg layout for menupunkter på undermenuer */
.layout_01 #menu ul li ul li a {
color:#FFF;
font-size:14px;
padding: 5px 8px 5px 8px;
}
/* Her sætter jeg layout for det valgte menupunkt */
.layout_01 #menu ul li .aktiv {
background: #9d333f;
color:#FFF;
}
/* Her sætter jeg layout for mouse-over på topniveau */
.layout_01 #menu ul li a:hover {
color:#009CDD;
text-decoration:underline;
}
.layout_01 #menu li:hover ul {
display: block;
position: absolute;
}
.layout_01 #menu li:hover li {
float: none;
font-size: 12px;
z-index:99;
}
/*Her sætter jeg baggrundsfarve på den aktive dropdownmenu*/
.layout_01 #menu li:hover li a {
background-image:url(../grafik/layout/menu_drop_bg.png);
border-bottom:1px solid #000;
border-left:1px solid #000;
border-right:1px solid #000;
color:#FFF;
font-weight:bold;
}
/*Her sætter jeg baggrundsfarve på det aktive menupunkt i dropdown*/
.layout_01 #menu li li a:hover{
border-bottom:1px solid #000;
background: #00354e }
.layout_01 #menu .bund{
border-bottom:1px solid #FFF;
}