Hallo liebe Gemeinde,
ich habe 'mal wieder ein kleines Problem:
beim hover über einem Element der Navigation (MainMenu a:hover) soll im div ".main" ein Overlay eingeblendet werden, das die Seite abdunkelt.
Ich habe bisher:
1. das eigentliche Overlay:
.overlay {
display: none;
position: absolute;
top: -15px;
left: 0px;
background-color: rgba(0,0,0,0.75);
width: 100%;
height: 100%;
margin-bottom: -100%;
margin-right: -100%;
z-index: 300;
-moz-border-radius: 10px;
-webkit-border-radius:10px;
border-radius: 10px;
}
Dieses liegt im div ".main".
2. meinen nicht funktionierenden Codeschnipsel, der Elemente im div ".header", hier genauer eben das "MainMenu a" nutzen soll, um das Overlay sichtbar zu machen:
MainMenu a:hover .overlay {
display: block;
}
Wenn ich das Overlay im css direkt auf display:blocK setze, ist alles so, wie es sein soll. Die z-indices stimmen also. Offenbar mache ich aber Fehler beim Ansprechen der Elemente. Ich komm' nur nicht drauf, welche. Kann jemand helfen?
Gruß
dieselross
--
- life's for learning -
Ceterum censeo IE esse delendam
besucht mich auf www.re-ality.de
- life's for learning -
Ceterum censeo IE esse delendam
besucht mich auf www.re-ality.de