Mittelbreites Menü nicht klickbar #107

New Issue

muli · 2022-07-11T22:45:50+02:00

muli commented

2022-07-11 22:45:50 +02:00

Skaliert man die Seite in der Breite gibt es 3 harte Schritte, in der sich jeweils der Header und im letzten Schritt auch das Menü anpasst. In den ersten beiden Schritten ist das Menü normal benutzbar. Im vorletzten Schritt lassen sich die Links in den Untermenüs nicht mehr klicken. In der schmalsten Version verwandelt es sich in einen Hamburger und die ausgeklappte Version ist wieder klickbar.

Sehe ich in Firefox (non Webkit), im Safari (Webkit) und Brave (auch Webkit). Dürfte also ziemlich überall kaputt sein. Stellt sich die Frage, ob das schon immer so war. Gehört aber so oder so gefixt.

Skaliert man die Seite in der Breite gibt es 3 harte Schritte, in der sich jeweils der Header und im letzten Schritt auch das Menü anpasst. In den ersten beiden Schritten ist das Menü normal benutzbar. Im vorletzten Schritt lassen sich die Links in den Untermenüs nicht mehr klicken. In der schmalsten Version verwandelt es sich in einen Hamburger und die ausgeklappte Version ist wieder klickbar. Sehe ich in Firefox (non Webkit), im Safari (Webkit) und Brave (auch Webkit). Dürfte also ziemlich überall kaputt sein. Stellt sich die Frage, ob das schon immer so war. Gehört aber so oder so gefixt.

muli self-assigned this 2022-07-11 22:45:50 +02:00

muli referenced this issue

2022-07-24 11:47:51 +02:00

#107_mittelbreites_menu_nicht_klickbar #114

muli commented

2022-07-24 11:52:34 +02:00

Grund für die Unklickbarkeit war eine Lücke zwischen dem Menüelement und dem Untermenü. In der breiten Ansicht wird das Menü in einem CSS-Grid arrangiert. Das entfällt in der schmaleren Version. Hier schrumpfte das Listenelement der einzelnen Menüpunkte in der Höhe zusammen. Dadurch verließ man auf dem Weg zum Submenü das Listenelement und die Hover-Pseudoklasse wurde entfernt, wodurch das Submenü verschwand.

Funfact:

Hauptanwendungsfall für die mittelschmale Ansicht dürften Tablets hochkant sein. Zumindest unter iOS lässt sich durch touchen das Hover-Element toggeln. Hier tritt der Bug also gar nicht auf.

Grund für die Unklickbarkeit war eine Lücke zwischen dem Menüelement und dem Untermenü. In der breiten Ansicht wird das Menü in einem CSS-Grid arrangiert. Das entfällt in der schmaleren Version. Hier schrumpfte das Listenelement der einzelnen Menüpunkte in der Höhe zusammen. Dadurch verließ man auf dem Weg zum Submenü das Listenelement und die Hover-Pseudoklasse wurde entfernt, wodurch das Submenü verschwand. Funfact: Hauptanwendungsfall für die mittelschmale Ansicht dürften Tablets hochkant sein. Zumindest unter iOS lässt sich durch touchen das Hover-Element toggeln. Hier tritt der Bug also gar nicht auf.

muli closed this issue

2022-07-24 12:19:34 +02:00

muli added the

bug

label 2022-07-24 12:29:13 +02:00

Sign in to join this conversation.