Nein, nicht FF. Safari ist dran. Ein eher kleines „Schmierzettel-Projekt“, in dem ich mit counter()
und Co ein paar Orientierungsmarken gesetzt hatte. Die gekürzte Struktur:
<head>
<style>
/* Counter */
body { counter-reset: Staffel Episode Total; }
article /* Staffeln */ {
counter-reset: Episode;
counter-increment: Staffel;
}
section /* Episoden */ { counter-increment: Episode Total; }
section::before {
grid-area: Meta;
content: "Staffel " counter(Staffel) " Episode "counter(Episode) " (Total: " counter(Total) ")";
}
…
article {
display: grid;
grid: "Überschrift" min-content "Aufzählung" 1fr / 1fr;
}
section {
container-type: inline-size;
display: grid;
grid: "Meta Titel" min-content "Meta Beschreibung" min-content "Meta Metadata" min-content / 20ch 1fr;
}
section > header {
grid-area: Titel;
…
}
section > main { grid-area: Beschreibung; }
section > footer { grid-area: Metadata; }
</style>
</head>
<body>
<header>…</header>
<article>
<header>…</header>
<section>
<header>…</header>
<main> … </main>
<footer> … </footer>
</section>
</article>
</body>
Der Knackpunkt: container-type: inline-size;
. Mit der Zeile drin zählt da Safari nur noch von 0-0-0 nach 0-0-0. Abgesehen von extra eingefügten Zeilen zwischendrin (zwischen den „Artikeln“), die belegen, daß da z. B. Total
sehr wohl vorhanden ist und hochgezählt wird.
Löscht man den container-type
, funktioniert das Zählen wie erwartet.
Und: da verhält sich Firefox „brav“. Also falls der nicht noch irgend welche andere, noch nicht enteckte, Spezialiäten bzgl. container-type
bereit hält.