Hallo Walter, ich habe kein Archiv der diversen Threads, die hier zu eurem Thema gelaufen sind. Was nicht im aktuellen Thread steht, das ist meinem Gedächtnis ziemlich sicher entglitten. Vor allem ist es schwierig für uns, nachzuhalten, wer von den aktuellen Forenbesuchern zu einem Team gehört. [Dieser Thread von Lydia](https://forum.selfhtml.org/self/2025/aug/09/anmerkung-frage-zu-frickl-beispiel/1821348#m1821348) legt nahe, dass ihr das Menü im schmalen Modus per details/summary aufklappbar haben wollt. An dieser Stelle seid ihr ohne JavaScript verloren, denn ihr wollt ja im breiten Viewport das Details-Element ständig aufgeklappt haben und das ist ohne JS nicht lösbar. Aber ich meine, es wäre diskutiert worden, dass ihr das Menü auf schmalen Viewports per details/summary auf- und zuklappen wollt. <https://jsfiddle.net/Rolf_b/k2btqc8o/> Dieses Fiddle führt die Medienumschaltung per JavaScript durch, mit einer [window.matchMedia](https://wiki.selfhtml.org/wiki/JavaScript/Window/matchMedia)-Abfrage. Diese Abfrage im Script ist nötig, um das details-Element bei breitem Viewport zu öffnen, und ich möchte die Regel nicht im Script und im CSS doppeln. Deshalb gibt's keine @media-Rule, sondern das Script setzt eine Klasse "wideScreen" auf dem Body und die nötigen Layout-Umbauten im CSS reagieren auf diese Klasse. Die Umschaltbreite ist im Parameter des matchMedia-Aufrufs zu finden. Was matchMedia tut, findet ihr im Wiki. Das Gesamtlayout ist "small first", d.h. die "Normaldarstellung" des Body ist der schmale Bildschirm. Die wideScreen-Klasse baut das Layout für breiten Bildschirm um, indem das Body-Grid eine zweite Spalte bekommt und die absolut-Positionierung des Menüs zurückgebaut wird. Das Menü ist oben links im Main-Bereich positioniert (grid-area:main und [place-self: start start](https://wiki.selfhtml.org/wiki/CSS/Eigenschaften/place-self)). Als Kommentar ist eine Alternativplatzierung im Header dabei (grid-area:head und place-self: end start). Bei Unklarheiten gerne fragen bzw. die Stichwörter im Wiki nachlesen. _Rolf_ -- sumpsi - posui - obstruxi

Hallo Walter, ich habe kein Archiv der diversen Threads, die hier zu eurem Thema gelaufen sind. Was nicht im aktuellen Thread steht, das ist meinem Gedächtnis ziemlich sicher entglitten. Vor allem ist es schwierig für uns, nachzuhalten, wer von den aktuellen Forenbesuchern zu einem Team gehört. [Dieser Thread von Lydia](https://forum.selfhtml.org/self/2025/aug/09/anmerkung-frage-zu-frickl-beispiel/1821348#m1821348) legt nahe, dass ihr das Menü im schmalen Modus per details/summary aufklappbar haben wollt. An dieser Stelle seid ihr ohne JavaScript verloren, denn ihr wollt ja im breiten Viewport das Details-Element ständig aufgeklappt haben und das ist ohne JS nicht lösbar. Aber ich meine, es wäre diskutiert worden, dass ihr das Menü auf schmalen Viewports per details/summary auf- und zuklappen wollt. <https://jsfiddle.net/Rolf_b/k2btqc8o/> Dieses Fiddle führt die Medienumschaltung per JavaScript durch, mit einer [window.matchMedia](https://wiki.selfhtml.org/wiki/JavaScript/Window/matchMedia)-Abfrage. Diese Abfrage im Script ist nötig, um das details-Element bei breitem Viewport zu öffnen, und ich möchte die Regel nicht im Script und im CSS doppeln. Deshalb gibt's keine @media-Rule, sondern das Script setzt eine Klasse "wideScreen" auf dem Body und die nötigen Layout-Umbauten im CSS reagieren auf diese Klasse. Das Gesamtlayout ist "small first", d.h. die "Normaldarstellung" des Body ist der schmale Bildschirm. Die wideScreen-Klasse baut das Layout für breiten Bildschirm um, indem das Body-Grid eine zweite Spalte bekommt und die absolut-Positionierung des Menüs zurückgebaut wird. Das Menü ist oben links im Main-Bereich positioniert (grid-area:main und [place-self: start start](https://wiki.selfhtml.org/wiki/CSS/Eigenschaften/place-self)). Als Kommentar ist eine Alternativplatzierung im Header dabei (grid-area:head und place-self: end start). Bei Unklarheiten gerne fragen bzw. die Stichwörter im Wiki nachlesen. _Rolf_ -- sumpsi - posui - obstruxi