DropDown Menü dauerhaft offen, wo liegt das Problem ?!

[Rolf b]

So, ich habe die Codewurst mal viviseziert und auf das Wesentliche REDUZIERT. Folgende Fehler stelle ich fest:

• es fehlt ein Style, der den Normalzustand des Popup auf display:none festlegt
• IDs müssen eindeutig sein, mehrfache Verwendung von id="submenu" ist nicht zulässig. Du kannst statt dessen class="submenu" zuordnen und im CSS mit ul.submenu ansprechen
• Du gibst dem ul#submenu ein position:absolute. Das ist ok, aber benötigt eigentlich ein Elternelement mit position:relative, das den Bezugspunkt für das absolut positionierte Element liefert. Entweder hast Du den entsprechenden Style nicht mitgeliefert, oder es funktioniert bei Dir nur deshalb, weil Du für das Menü keine top/left Angaben machst. Sobald Du es nur um ein Pixel anderswo haben willst, wird der Browser es relativ zum einzigen vorhandenen position:relative Element platzieren, und das ist der body.
• In meiner Ansicht erscheint das Menü als Lord Vetinari Wappen, ich habe die Hintergrundfarben etwas angepasst um den Text lesen zu können. Deine Komplettseite hat vermutlich weitere styles, die die Textfarbe ändern.
• Ich bezweifle, dass das nav Element für handgestyle Popup-Menüs sinnvoll ist. Es bezeichnet eigentlich den Navigationsbereich der ganzen Seite und bringt über role='navigation' entsprechende Aria-Informationen mit. Das wäre aber schon falsch, für Popups ist eigentlich role='menu' richtig. Ich würde es an deiner Stelle weglassen, dem ul.submenu die menu-Rolle geben und die Popup-Steuerung komplett daran festmachen.

Der größte Honk ist dieser:

• nav li:hover #submenu { display: block;} sieht aus wie der Versuch, das Submenü auf display:block zu schalten, wenn man über einem List-Item hovert. Das kann aber so nicht funktionieren, weil der Selektor "nav li:hover #submenu" ein Element mit id="submenu" trifft, das sich innerhalb eines li:hover befindet, das sich innerhalb eines nav befindet. Das HTML hat aber eine andere Hierarchie. Eine Alternative könnte td:hover ul.submenu sein. Das setzt dann natürlich voraus, dass ul.submenu einen Default-Style mit display:none hat.

So. Damit hast Du erstmal ein paar Hausaufgaben (und ich habe hoffentlich alle meine Tibfäler gefunden) ;-)

Rolf