Fertige Layouts - vorerst fertig!

[Gunnar Bittersmann]

@@Henry

Na ja, bevor ich hier noch lange schreibe, hier mal der erste Entwurf.

So funktioniert das nicht:

nav ul { visibility: hidden }
nav:hover > ul { visibility: visible }

Merke: Wo immer :hover ist, sollte :focus nicht weit sein. Nicht jeder Nutzer schubst eine Maus; eine Webseite muss auch per Tastatur bedienbar sein.

Das Pseudoelement nav::before (einzig das Hamburger-Icon (dem eine Beschriftung wie „Menü“ fehlt) ist vom nav-Element bei Portrait-Viewport^[1] sichtbar) ist aber gar kein interaktives Element – es kann nicht per Tastatur angesprungen werden. Zum Auf- und Zuklappen muss ein Button vorgesehen werden, wie in diesem Beispiel.

LLAP 🖖

---

1. Die Darstellung des Menüs sollte an der zur Verfügung stehenden Breite festgemacht werden, nicht daran, ob diese größer oder kleiner als die Höhe ist. ↩︎