Navileiste, optimierung auf FF

[snapSHOT]

Hallo,
ich habe hier eine Navigationsleiste(Optimiert für Opera, für Optimierung auf IE sorg ich nocht später), bei der CSS-basiert eine Unternavileiste ausklappt.
Eines macht mir aber Rätsel:
Schauts euch am besten selber an, was passiert, wenn man über "bsp1" bzw. "bsp2" fährt.

Hier der Navileistencode:

<ul id="navi">
       <li id="eins"><span>bsp1</span>
        <ul id="weg">
           <li><a href="a.htm">dada</a></li>
           <li><a href="b.htm">Newsletter</a></li>
           <li><a href="c.htm">Stundenplan erstellen</a></li>
         </ul>
       </li>
       <li id="zwei"><span>Navigation f&uuml;r diese Seite</span>
        <ul id="weg1">
         <li><a href="d.htm">d</a></li>
         <li><a href="e.htm">e</a></li>
         <li><a href="f.htm">f</a></li>
         <li><a href="g.htm">g</a></li>
         <li><a href="h.htm">h</a></li>
         <li><a href="i.htm">i</a></li>
         <li><a href="j.htm">j</a></li>
         <li><a href="k.htm">k</a></li>
        </ul>
       </li>
       <li><a href="formular.htm">E-Mail an mich</a></li>
       <li><a href="http://www.google.de">Google</a></li>
       <li><a href="http://www.alltheweb.com">Alltheweb</a></li>
       <li><a href="http://de.wikipedia.org">wikipedia</a></li>
      </ul>

CSS-Code:

ul#navi li ul#weg,#weg1 { display:none; }

ul#navi li#eins:hover ul#weg { display:block; position:fixed; top:73px; left:280px; text-align:left; }

ul#navi li#zwei:hover ul#weg1 { display:block; position:fixed; top:106px; left:280px; text-align:left; }

ul#navi { list-style:none; font-size:16px; float:left; width:210px; padding:0; border: 2px ridge silver; margin:27px 0 22px 22px; background-color:gray; position:absolute; }

ul#navi li { padding:0.3em; color:#000000; font-weight:bold; }

ul#navi a { display:block; padding:0.2em; font-weight:bold; }

ul#navi a:link { color:black; background-color:white; }

ul#navi a:visited { color:#555555; background-color:white; }

ul#navi a:hover { color:white; background-color:black; }

ul#navi a:active { color:white; background-color:silver; }

ul#weg,#weg1 { list-style:none; font-size:16px; position:relative; width:150px; padding:2px; border: 2px dotted silver; margin:22px 0 5px 0; background-color:gray; }

ul#weg,#weg1 a { display:block; font-weight:bolder; }

ul#weg,#weg1 a:link { color:white; background-color:gray; }

ul#weg,#weg1 a:visited { color:white; background-color:#999; }

ul#weg,#weg1 a:hover { color:black; background-color:gray; }

ul#weg,#weg1 a:active { color:silver; background-color:gray; }

Hat jemand ne Idee, worans liegt?

MfG

[D.R.]

Hallo,

[…]Optimiert für Opera […] Optimierung auf IE

Diese Wörter solltest du meiden ;-)

Schauts euch am besten selber an, was passiert, wenn man über "bsp1" bzw. "bsp2" fährt.

Dann wird eine Unternavigation in unerreichbarer Entfernung angezeigt. Sowohl im Firefox, als auch im Opera. Ich kann absolut keine Unterschiede feststellen.

Hat jemand ne Idee, worans liegt?

Was denn?

Ich kann dir nur empfehlen, mit position:fixed etwas sparsamer umzugehen. Verwende lieber position:absolute innerhalb von Elementen, die mit position:relative ausgestattet wurden.

Getestet habe ich auf dieser Seite: Beispiel.

mfg. Daniel