nicht angemeldet
Hallo zusammen,
ich habe eine Navigation mit ULs und LIs und display block. Im Firefox klappt das alles wunderbar, doch im IE funktioniert der Hover-Effekt (Änderung der Hintergrundfarbe) nur, wenn man direkt über das Wort fährt. Wenn sich der Mauszeiger im Kasten nebem dem Wort befindet, klappt der Hover-Effekt nicht (was im FF geht).
Kann mir jemand helfen? Danke!
Mfg
Konstantin
***********************************
* {
padding: 0;
margin: 0;
}
#nav {
width: 250px;
margin: 266px 0 0 5px;
font-family: verdana, arial;
position: absolute;
}
#nav a {
display: block;
text-decoration: none;
}
#nav li, ul {
list-style-type: none;
}
#nav .l1 li a {
color: #FFEBCD;
padding: 6px 10px 6px 20px;
background-color: #8B4513;
border-bottom: solid thin #FFFAF0;
margin: 8px 0 0 0;
}
* html #nav .l1 li a {
color: #FFEBCD;
padding: 6px 10px 22px 22px;
background-color: #8B4513;
border-bottom-style: solid;
border-bottom-width: 1pt;
margin: -8px 0 0 0;
}
#nav .l1 a:hover {
text-decoration: underline;
}
#nav .l2 li a {
padding: 3px 5px 3px 30px;
margin: 0px;
background-color: white;
color: #000000;
border-bottom: solid thin #8B4513;
border-right: solid thin #8B4513;
border-left: solid thin #8B4513;
}
* html #nav .l2 li a {
padding: 3px 10px 3px 31px;
margin: -16px 0 0 0;
background-color: white;
color: #000000;
border-bottom: solid 1pt #8B4513;
border-right: solid 1pt #8B4513;
border-left: solid 1pt #8B4513;
}
#nav .l2 li a:hover {
background-color: #F2D5B6;
text-decoration: none;
}
****************************************
<div id="nav">
<ul class="l1">
<li><a href="link1.html" style="border: none;">Link1</a>
<ul class="l2">
<li><a href="link2.html">Link2</a></li>
<li><a href="link3.html">Link3</a></li>
<li><a href="link4.html">Link4</a></li>
</ul>
</li>
<li><a href="link5.html" style="border: none;">Link5</a>
<ul class="l2">
<li><a href="link6.html">Link6</a></li>
<li><a href="link7.html">Link7</a></li>
</ul>
</li>
</ul>
</div>