Die Media-Queries bringen mich zum Heulen...

[Rolf B]

Hallo Gunnar,

Bei großem Viewport ist das Menü permanent sichtbar und der Button nicht sichtbar: display: none; und auch nicht im accessibility tree, d.h. nicht bei Tastatur erreichbar.

Bei kleinem Viewport ist der Button sichtbar und schaltet bei jedem Click sein aria-expanded-Attribut zwischen "true" und "false" um, was anzeigt (d.h. im Screereader ansagt), ob das Menü ausgeklappt ist oder nicht.

Das Problem ist hier, dass es zwei Navigationen gibt: im Kreuzbalken und im Stamm. Ich bin seit gestern nachmittag am Basteln, wie man das am besten lösen könnte, und verwende dafür Code-Teile aus einem Pen von Dir. Ist das okay?

Was ich nicht verstanden habe, ist die Anforderung, dass der Button im nav liegen muss. Ist das für die Bedienbarkeit zwingend? Das macht die Layoutsteuerung deutlich komplizierter.

Und im Fall von Michael gibt's zwei Navis - da entsteht die Frage, in welche der Button gehört.

Mein Plan ist zur Zeit, im Narrow Viewport das Kreuz-Layout wegzulassen, die beiden Navis nebeneinander zu platzieren und einen Aufklappbutton einzublenden. Ich bin nur gestern nicht so weit gekommen, etwas vorzeigen zu können, und heute muss ich wieder arbeiten. Die Herausforderung ist, das ganze HTML so zu gestalten, dass man im Wide Viewport das Kreuz-Layout (mit Navi in Balken und Stamm) rein per CSS herstellen kann.

Nein, ich halte dein Bier nicht dafür 😉

Rolf