In diesem Beitrag erstellen Sie eine responsive Navigation, die immer funktioniert: Ohne JavaScript sehen die Besucher eine hübsche Navigationsliste, mit JavaScript gibt es einen Menübutton, der die Navigationsliste bei Berührung sanft einblendet. In breiten Viewports bekommen die Besucher eine horizontale Navigation.
Sticky CSS Grid Items
Melanie Richards erklärt, wie man position: sticky
innerhalb eines Grid-Layouts einsetzen kann.
CSS-Tricks – A Complete Guide to Grid
Eines der besten Nachschlagewerke zum »CSS Grid Layout« ist der »Complete Guide« von CSS-Tricks.
CSS-Tricks – A Complete Guide to Flexbox
Eines der besten Nachschlagewerke zum »Flexible Box Layout« ist der »Complete Guide« von CSS-Tricks.com.
Listen: ausrichten per CSS-Grid
In Kapitel 4 von »Einstieg in HTML und CSS« zeige ich, wie man Beschreibungslisten, die auch unter ihrem alten Namen Definitionslisten bekannt sind, erstellen und gestalten kann. Mit ein paar einfachen Anweisungen aus dem in Kapitel 24 vorgestellten CSS Grid Layout kann man solche Listen sehr einfach ausrichten.
CSS-Layouts? Ohne float? Echt?
Mehrspaltige Layouts wurden in CSS lange Zeit quasi in Notwehr mit Eigenschaften wie float
oder position
umgesetzt. Das war zwar besser als die HTML-Tabellen der 90er-Jahren, aber alles andere als einfach. Inzwischen geht das viel einfacher.