Wissen und Dateien: Zwei Raster, die ihren Inhalt verloren haben

Filipe zum Bildschirmfoto der Wissen-Seite: "erstens sieht das richtig
scheisse aus". Zu sehen war die Kategorie-Auswahl quer ueber "STUFE",
"GERAET", "VEROEFFENTLICHT AM" und den Tag-Knoepfen. Text auf Text.

Zweimal dieselbe Ursache, zweimal ein Raster, das Kinder in eine Zelle
zwingt, die zu klein ist:

1. FORMULAR "NEUE ANLEITUNG" (aufgaben.css). Die Regel
   `grid-template-rows: 1fr 44px` gibt jeder Zelle eine feste
   Eingabezeile -- richtig und wichtig, damit alle Felder auf einer
   Linie sitzen. Die Zelle "Hauptkategorie" enthaelt aber keine
   Eingabe, sondern sechs Gruppen mit zwanzig Knoepfen. Gemessen: der
   Kasten 40 px hoch, sein Inhalt 442 -- 402 px liefen ueber alles
   darunter. Unter 560 px passierte das nicht, weil dort ohnehin
   `auto auto` gilt; deshalb sah es am Handy richtig aus.
   Es ist exakt die Falle, die eine Regel darueber schon einmal
   zugeschnappt ist ("EINE ZELLE, DIE AUFKLAPPT ..."). Dieselbe
   Antwort, diesmal fuer .katwahl.

2. DATEILISTE (dateien.css). .datei hat die Spalten `34px 1fr auto`.
   Die ersten vier Kinder sitzen richtig; alles danach wird automatisch
   platziert und landet in der ZEICHENSPALTE. Gemessen: "Fassung 2" in
   34 px Breite, 22 px herausragend; auf 390 px zusaetzlich die
   Metazeile ("1,9 MB" in zwei Zeilen) und "Sichtbar fuer" mit 49 px
   Ueberstand.

ZWEI NEUE PRUEFUNGEN, und die erste war erst selbst falsch:
pruef-wissen-formular.mjs verglich zunaechst den KASTEN der Auswahl mit
dem der Zelle und meldete gruen, waehrend das Bildschirmfoto die
Ueberlappung deutlich zeigte. Der Kasten ist ja brav 44 px hoch --
herausgelaufen ist sein INHALT. Jetzt wird scrollHeight gegen
clientHeight gemessen, und die Pruefung wird rot, bevor der Fix
dazukommt. pruef-dateien-liste.mjs legt bewusst zweimal dieselbe Datei
ab, damit "Fassung 2" und "nicht mehr aktuell" ueberhaupt entstehen.

Versionsstempel neu gesetzt (202610011426, 670 Verweise in 45 Dateien).
Ohne ihn liegt die Korrektur auf dem Server und kommt bei niemandem an:
Cache-Control steht auf immutable.

Co-Authored-By: Claude Opus 5 <[email protected]>

workspace/assets/css/aufgaben.css

@@ -102,6 +102,28 @@
   align-content: start;
 }
 
+/* UND DASSELBE FUER DIE KATEGORIE-WAHL (01.10.2026).
+   ---------------------------------------------------------------------
+   Filipe zum Bildschirmfoto der Wissen-Seite: "erstens sieht das richtig
+   scheisse aus". Zu sehen: Die Kategorie-Auswahl lag quer ueber "STUFE",
+   "GERAET", "VEROEFFENTLICHT AM" und den Tag-Knoepfen -- Text auf Text.
+
+   Gemessen (pruef-wissen-formular.mjs): Die Zelle gibt ihrer zweiten
+   Rasterzeile feste 44 px. Darin steht aber keine Eingabe, sondern
+   .katwahl mit sechs Gruppen und zwanzig Knoepfen. Der Kasten war
+   40 px hoch, sein Inhalt brauchte 442 -- 402 px liefen heraus und
+   ueber alles darunter. Unter 560 px passiert das nicht, weil dort
+   ohnehin `grid-template-rows: auto auto` gilt; genau deshalb sah es
+   auf dem Handy richtig aus und am Rechner kaputt.
+
+   Es ist exakt dieselbe Falle wie eine Regel weiter oben: Etwas, das
+   groesser werden kann, darf keine feste Hoehe haben. Dort war das
+   Merkmal `aria-expanded`, hier ist es die Klasse selbst. */
+.neu__raster > *:has(> .katwahl) {
+  grid-template-rows: auto;
+  align-content: start;
+}
+
 /* EIN HINWEIS UNTER EINEM FELD HAENGT UNTER DEM RASTER, NICHT DARIN
    (17.09.2026).
 

workspace/assets/css/dateien.css

@@ -92,9 +92,33 @@
 .marke-status[data-status="freigegeben"] { background: rgba(77, 171, 119, .18); color: #79d1a2; }
 
 
+/* ALLES UNTER DER KOPFZEILE GEHOERT NEBEN DAS ZEICHEN (01.10.2026).
+   ---------------------------------------------------------------------
+   Filipe: "es sieht sogar noch richtig scheisse aus wenn ich da was
+   hochladen will."
+
+   Die ersten vier Kinder sitzen, wo sie sollen: Zeichen, Name, Knoepfe,
+   Metazeile. Alles DANACH wird vom Raster automatisch verteilt -- und
+   landet in der ersten freien Zelle. Das ist die ZEICHENSPALTE, und die
+   ist 34 Pixel breit. Gemessen (pruef-dateien-liste.mjs): "Fassung 2"
+   stand in 34 px und ragte 22 px heraus; auf 390 px traf es zusaetzlich
+   die Metazeile ("1,9 MB" brach in zwei Zeilen) und "Sichtbar fuer",
+   das 49 px herausragte.
+
+   Diese Bloecke bekommen deshalb ausdruecklich die Spalten ab der
+   zweiten. Auf das Zeichen folgt dann nichts mehr -- und genau so war
+   es gemeint. */
+.datei > .fassung,
+.datei > .datei__freigaben,
+.datei > .datei__wahl { grid-column: 2 / -1; }
+
 @media (max-width: 720px) {
   .datei { grid-template-columns: 34px 1fr; }
   .datei__knoepfe { grid-row: auto; grid-column: 1 / -1; margin-top: 9px; }
+  /* Nur hier: Am Rechner sitzt die Metazeile richtig (Zeile 2, Spalte 2).
+     Sobald die Knoepfe aber ueber die ganze Breite gehen, rutscht sie
+     hinter ihnen in die Zeichenspalte. */
+  .datei > .datei__zeile { grid-column: 2 / -1; }
 }
 
 /* Hinweis statt Ablegefeld, wenn jemand nicht hochladen darf. */