Problem mit dem 1px "Spalt" zwischen Dropdownbutton und -liste
sinthoras
- html
Hallo allerseits.
Ich habe ein sehr seltsames Problem mit einer Dropdown-Auswahl in einem meiner Projekte. Das Thema ist eigentlich eine Mischung aus "HTML", "CSS", "JavaScript" und vielleicht auch "Browser", aber ich poste es mal hier. Ich weiß nicht mehr weiter und hoffe, hier kann mir jemand helfen =)
Zuerst muss ich kurz etwas über den Aufbau der Seite sagen...
Ich hab eine dreispaltige Website, das <div> der linken Seite und das der rechten seite sind mit position:"absolute" und top/left/right/bottom positioniert und haben einen z-Index von 2, das <div> der Mitte ist position:"relative" und hat padding-left in der Breite des linken <div>, damit man den Inhalt sehen kann. Weiterhin besitzen alle <div> ein float:left. Ich weiß, das klingt komisch, hat aber seinen Sinn, den zu erklären hier aber auch nicht weiter helfen wird.
Für eine bestimte Funktionalität der Website haben alle <div> einen onmouseover-Eventhandler, der jeweils eine andere JavaScript-Funktion aufruft.
In dem mittleren <div> habe ich nun eine Dropdown-Auswahlliste (ein <select> mit size="1") das ein komisches Verhalten an den Tag legt. Wenn ich auf den "Button" der Liste klicke, poppt wie erwartet die Liste auf. Gehe ich nun mit der Maus nach unten, um einen Eintrag auszuwählen, schließt sich die Liste wieder.
Nach einigem herumtüfteln mit Firebug fand ich heraus, dass der 1px hohe "Spalt" zwischen dem Button und der Liste nicht zu meinem mittleren <div>, sondern zu dem linken zu gehören scheint. Sobald ich mit der Maus auf diesen Spalt gehe, wird jedenfalls die onmouseover-Funktion des linken <div> aufgerufen, was ich mir nur so erklären kann.
Allein dies ist ja schon sehr seltsam. Noch seltsamer ist aber, dass dieser Fehler NICHT mehr auftritt, wenn ich Firebug offen haben. Sobald ich es auch nur minimiere, tritt der Fehler wieder auf.
Fragen nun: Warum zur Hölle passiert das? Kann man das abstellen/umgehen, so dass ich die Dropdown-Liste trotzdem benutzen kann?
Ich habe jetzt mal keine Code gepostet, da das ganze ein sehr komplexes Projekt ist und ich garnicht genau wüsste, was ich da posten sollte. Der ganze Code wäre ein bisschen viel. Dazu kommt, dass ein Großteil des Codes per JavaScript dynamisch generiert wird. Falls es hilfreich ist, kann ich aber trotzdem noch was posten.
Achja... ich benutze übrigens Mozilla Firefox Version 3.6.13 auf einem MacBook Pro 13" mit OS X 10.6.6
Ich hoffe, jemand kann mir helfen! =/