Hallo liebe Leute,
wie der Titel schon sagt, habe ich ein Problem mit einer Dropdown Navigation in Opera.
Im FF, IE und Safari funzt alles soweit. Nur in Opera tritt folgendes Problem auf.
Die 2. Ebene der Navigation wird richtig dargestellt. Sobald ich aber mit der Maus drüber fahren möchte, verschwinden die Links in der 2. Ebene. Also sind sie nicht anklickbar.
Wer kann mir helfen oder weiß einen Rat?
Ich danke schon im voraus für jeden Tipp.
Hier der code:
HTML-Code:
<div class="mod_navigation block">
<a href="home#skipNavigation2" class="invisible">Navigation überspringen</a>
<ul class="level_1">
<li class="first"><a href="home" title="Home" class="first">Home</a></li>
<li class="submenu"><a href="unternehmen" title="Unternehmen" class="submenu">Unternehmen</a><ul class="level_2">
<li class="first"><a href="kontakt-und-anfahrt" title="Kontakt und Anfahrt" class="first">Kontakt und Anfahrt</a></li>
<li><a href="zertifizierungen-und-auszeichnungen" title="Zertifizierungen und Auszeichnungen">Zertifizierungen und Auszeichnungen</a></li>
<li class="last"><a href="referenzen" title="Referenzen" class="last">Referenzen</a></li>
</ul>
</li>
<li class="submenu"><a href="themen" title="Themen" class="submenu">Themen</a><ul class="level_2">
<li class="versandlogistik first"><a href="logistik" title="Versandlogistik" class="versandlogistik first">Versandlogistik</a></li>
<li class="aussenwirtschaft"><a href="aussenwirtschaft" title="Außenwirtschaft" class="aussenwirtschaft">Außenwirtschaft</a></li>
<li class="lagerlogistik"><a href="kaufmaennische-software" title="Lagerlogistik" class="lagerlogistik">Lagerlogistik</a></li>
<li class="dienstleistungen"><a href="dienstleistungen" title="Dienstleistungen" class="dienstleistungen">Dienstleistungen</a></li>
<li class="hardware"><a href="hardware" title="Hardware und Etiketten" class="hardware">Hardware und Etiketten</a></li>
<li class="schnittstellen last"><a href="schnittstellen" title="Schnittstellen" class="schnittstellen last">Schnittstellen</a></li>
</ul>
</li>
<li class="submenu"><a href="produkte" title="Produkte" class="submenu">Produkte</a><ul class="level_2">
<li class="first"><a href="v-log" title="V-LOG - die Versandsoftware" class="first">V-LOG - die Versandsoftware</a></li>
<li><a href="f-cost-der-frachtkostenmanager" title="F-COST - der Frachtkostenmanager">F-COST - der Frachtkostenmanager</a></li>
<li><a href="z-atlas" title="Z-ATLAS - die Zollsoftware">Z-ATLAS - die Zollsoftware</a></li>
<li><a href="z-aeo" title="Z-AEO - zugelassener Wirtschaftbeteiligter">Z-AEO - zugelassener Wirtschaftbeteiligter</a></li>
<li><a href="s-check" title="S-CHECK - die Complianceprüfung">S-CHECK - die Complianceprüfung</a></li>
<li><a href="p-calc" title="P-CALC - die Präferenzkalkulation">P-CALC - die Präferenzkalkulation</a></li>
<li><a href="m-control-inventur-und-warenbewegungen" title="M-CONTROL - Inventur Warenbewegungen">M-CONTROL - Inventur Warenbewegungen</a></li>
<li><a href="z-emcs" title="Z-EMCS - die Verbrauchssteuermeldung">Z-EMCS - die Verbrauchssteuermeldung</a></li>
<li><a href="x-pert-beratung-und-entwicklung" title="X-PERT - Beratung und Entwicklung">X-PERT - Beratung und Entwicklung</a></li>
<li class="last"><a href="a-cademy-schulungskonzepte" title="A-CADEMY - Schulungskonzepte" class="last">A-CADEMY - Schulungskonzepte</a></li>
</ul>
</li>
<li class="submenu"><a href="news" title="News" class="submenu">News</a><ul class="level_2">
<li class="first"><a href="aussenwirtschaft-155" title="Außenwirtschaft" class="first">Außenwirtschaft</a></li>
<li class="last"><a href="logistik-156" title="Logistik" class="last">Logistik</a></li>
</ul>
</li>
<li class="last"><a href="partner" title="Partner" class="last">Partner</a></li>
</ul>
<a name="skipNavigation2" id="skipNavigation2" class="invisible"> </a>
</div>
CSS:
div.mod_navigation{
overflow:hidden;
float:left;
margin-top:-3px;
margin-left:0;}
div.mod_navigation ul{
margin:0;}
div.mod_navigation li{
width:auto;
float:left;
margin:0;
list-style: none;}
div.mod_navigation li li{
clear:both;}
div.mod_navigation a{
display:block;
padding:0.7em 1em 0.8em;
text-align:left;
background:url("../../navi_trennstrich.gif") right center no-repeat;
text-decoration:none;
font-size:12px;
color:#ffffff;}
div.mod_navigation a:hover, div.mod_navigation a:focus{
background-image:url("../..//bg.jpg");
background-repeat:repeat-x;
color: black;}
div#wrapper div.mod_navigation ul#level_1 a:active{
background-image:url("../..//bg.jpg");
background-repeat:repeat-x;
color: black;}
div.mod_navigation li ul{
width:0;
height:0;
top:-9999px;
position:absolute;
display:inline;
left: -9999px;
background-color: transparent;}
div.mod_navigation li:hover ul, div.mod_navigation li.sfhover ul{
width:auto;
height:auto;
left:auto;
top:auto;
display:block;
z-index:1500;}
div.mod_navigation ul.level_2 li a{
padding:0.4em 1em;
background-image:url("../../navi-bg.jpg");
background-repeat:repeat-x;
color:#ffffff;}
div.mod_navigation .level_1 .level_2 li a:hover{
background-image:url("../../bg.jpg");
background-repeat:repeat-x;
color:#000000;}
div.mod_navigation li li a{
width:20em;}