Links innerhalb und außerhalb der Liste der Elemente, die nicht arbeiten

Ich versuche, erstellen Sie eine ungeordnete Liste, wobei jedes li-element mit einem eigenen hintergrund-Bild (kein text, nur Bild), aber ich habe Probleme (im Firefox zumindest, es funktioniert in Safari) immer der link funktioniert. In Firefox, das Bild verändert sich auf zu schweben, aber Sie können nicht klicken Sie auf. Wie bekomme ich es in Firefox? Ich habe versucht, das A-tag innerhalb und außerhalb der li-tag.

Hier ist die CSS...

#menu   {
   width:107px;
   height:200px;
}

#menu-1, #menu-1-active, #menu-2, #menu-2-active, #menu-3, #menu-3-active, #menu-4, #menu-4-active, #menu-5, #menu-5-active, #menu-6, #menu-6-active    {
   width:107px;
   height:29px;
   padding-bottom:5px;
   background-repeat: no-repeat;
   display:block;
   text-indent: -999px;

}

#menu-1   {
   background-image: url(menu1.png);
}
#menu-1:hover   {
   background-image: url(menu1on.png);
}
#menu-1-active   {
   background-image: url(menu1on.png);
}


#menu-2   {
   background-image: url(menu2.png);
}
#menu-2:hover   {
   background-image: url(menu2on.png);
}
#menu-2-active   {
   background-image: url(menu2on.png);
}

etc

Und hier die HTML-Ausgabe...

<div id="menu">
<ul>

<a href="1"><li id="menu-1-active">
One
</li></a>
<a href="2"><li id="menu-2">
Two
</li></a>
<a href="3"><li id="menu-3">
Three
</li></a>
<a href="4"><li id="menu-4">
Four
</li></a>
<a href="5"><li id="menu-5">
Five
</li></a>
<a href="6"><li id="menu-6">
Six
</li></a>

</ul>
</div>
InformationsquelleAutor cannyboy | 2009-11-17
Schreibe einen Kommentar