Hallo,
anhand des unten stehenden Codes möchte ich Listenelemente auflisten und als Navigationselemente verwenden. Da diese unterschiedlich lang sind, soll man den Link auch anwählen können, wenn man in den Raum vor dem Element klickt.
HTML
<div class="moduletable_navBox">
<h3>Ueberschrift</h3>
<ul class="menu_one" id="_mi-studieren">
<li id="current" class="active item2">
<a href="../seite.html">
<span>Wert 1</span>
</a>
</li>
<li class="item3">
<a href="../seite.html">
<span>Wert 2</span>
</a>
</li>
<li class="item4">
<a href="../seite.html">
<span>Wert 3</span>
</a>
</li>
</ul>
</div>und hier ist der css Code:
HTML
.moduletable_navBox ul{
margin: -6px -5px 0px 5px;
padding-left:0;
list-style-image:none;
}
.moduletable_navBox li{
list-style-type:none;
width:135px;
padding-right:5px;
}
.moduletable_navBox li:hover{
font-weight:bolder;
color:#E87A0C;
background-color:#FFFFFF;
}
.moduletable_navBox a{
text-decoration:none;
color:#000000;
}
.moduletable_navBox a:hover{
font-weight:bolder;
color:#E87A0C;
background-color:#FFFFFF;
}An sich funktioniert fast alles. Die Farbe des Link Elements färbt sich nur leider nicht orange, sondern bleibt schwarz, solang sich der Mauszeiger vor den Element befindet. Wenn ich auf den Link bin, wird der Link in der korrekten Farbe angezeigt.
Wo befindet sich der Fehler im Code?