Gunnar Bittersmann: Ausgeklappte Navigation drückt den Footer nach unten

Beitrag lesen

problematische Seite

@@Bimmelbeule

Die obige Website hat alle Elemente dort wo ich sie haben will.

Nö, haste nicht.

Du willst vermutlich, dass <div class="nav"> den von dir benannten Bereich "nav" ausfüllt, der sich über zwei Zeilen erstreckt. Nur hast du das nirgendwo angegeben und deshalb füllt es nur die erste Zelle in der ersten Zeile.

Der Footer steht aber in der zweiten Zeite und weist deshald dieses Verhalten auf:

Im Viewport 50em und 70em wird allerdings der Footer nach unten weg gedrückt, wenn ich die Navigation ausklappe (in diesem Fall der Menüpunkt "Stadtteile").


Ist das überhaupt nur mit grid/css lösbar?

Ja. Es sollte nun auch klar sein, wie.

Und das div sollte das nav-Element sein; nicht mehrere nav-Elemente in dem Container. Du hast nur eine Navigation.

(Und sollte man wirklich mehrere nav-Elemente haben, müssen diese benannt sein, d.h. jeweils eine Überschrift haben oder per aria-label. Siehe Landmark Regions.)


Dein Skip-Link legt sich über das Wappen. Der sollte noch eine Hintergrundfarbe bekommen. (Und nein, der ist nicht (nur) für Screenreader-Nutzer da – die brauchen den nicht –, sondern vor allem für sehende Tastaturbenutzer.)

🖖 Живіть довго і процвітайте

--
„Im Vergleich mit Elon Musk bei Twitter ist ein Elefant im Porzellanladen eine Ballerina.“
— @Grantscheam auf Twitter