Handy: Sprachfenster (DE) klappte halb aus dem Bild auf

Nutzer-Report per Foto: beim Tippen auf "DE" im Handy-Menue erschien das
Sprachfenster halb links ausserhalb des Bildschirms, man konnte keine
Sprache mehr lesen oder treffen.

Ursache: Die Handy-Regel, die alle Aufklapp-Fenster auf statische Position
und volle Breite umstellt, hat den Sprachschalter nicht erreicht -- seine
Desktop-Regel (.sprach-schalter .nav-dropdown, 0-2-0) ist spezifischer,
und eine @media-Abfrage erhoeht die Spezifitaet nicht. Dadurch lief die
Desktop-Animation "sprach-dropdown-in" weiter, die per fill-mode:both
dauerhaft transform: translateX(-50%) setzt. Auf dem Desktop korrekt
(schmales Fenster mittig unter dem Knopf), im Handy-Menue aber toedlich:
das Fenster ist dort bildschirmbreit und wurde um seine halbe Breite nach
links geschoben (gemessen live: x = -148px bei 390px Viewport).

Fix: dieselben Handy-Regeln erneut mit ausreichender Spezifitaet fuer den
Sprachschalter, samt Kommentar zur Begruendung.

Geprueft mit Playwright (echter Browser): 390x844, 360x640, Querformat
844x390 und Tablet 768x1024 -> Fenster jeweils vollstaendig im Bild, alle
5 Sprachen sichtbar; Desktop 1920 unveraendert schmal und zentriert;
Sprachwechsel (English) funktioniert weiterhin.

Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
2026-08-22 11:27:22 +02:00
co-authored by Claude Opus 5
parent adb1042915
commit 3f9997456a
+21
View File
@@ -1555,6 +1555,27 @@ header.site-header {
.nav-dropdown { position: static; transform: none; box-shadow: none; width: 100%; margin-top: 0; animation: none; }
.nav-dropdown::before { display: none; }
.nav-group.open .nav-dropdown { display: flex; }
/* Bugfix 22.08.2026 (Nutzer-Report per Foto: "wenn ich auf DE klicke geht
das Fenster halb schräg auf, man sieht nichts"). Ursache: die Zeile
darüber (.nav-dropdown, Spezifität 0-1-0) hebt für das Handy-Menü
position/transform/animation auf — sie verliert aber gegen die
Desktop-Regel .sprach-schalter .nav-dropdown (0-2-0, Zeile ~427), denn
eine @media-Abfrage erhöht die Spezifität NICHT. Beim Sprachschalter
blieb dadurch die Aufklapp-Animation "sprach-dropdown-in" aktiv, und
die setzt (fill-mode: both) dauerhaft transform: translateX(-50%) —
die im Handy-Menü volle-Breite-Box wurde also um ihre halbe Breite
nach links aus dem Bild geschoben. Deshalb hier dieselben Regeln noch
einmal mit passender Spezifität (Blattname mitgenannt, damit sie in
jedem Fall gewinnt). */
.nav-links .sprach-schalter .nav-dropdown {
position: static;
transform: none;
animation: none;
width: 100%;
min-width: 0;
margin-top: 0;
box-shadow: none;
}
.nav-cta { align-self: flex-start; margin: 1rem 0 .6rem; }
/* Bugfix 20.08.2026 (Nutzer-Report: "auf dem Handy passt nicht immer alles").