Nur das alle Browser es so machen, bedeutet ja nicht unbedingt, dass das Verhalten sinnvoll ist. Vielleicht sind ja die Browser-Tests buggy. und die Browser werden Test-Driven programmiert. Ein Bug in der Definition bleibt weiterhin in meinen Augen ein Bug; lediglich das Herangehen zur Korrektur muss sich dann ändern.
Danke für den Hinweis auf die Erläuterungen bei MDN. Leider habe ich dadurch auch nicht verstanden, warum ind divh1-h1.png und dih1-divh1.png plötzlich im h3 ein Counter auf 0 zurückgesetzt wird, der im vorhergehenden h2 noch mit 1 angezeigt wurde. Habe ich hier etwas flasch verstanden?
Für den Definitionsfehler bei allen Browsern scheint es notwendig zu sein, dass sowohl das erste h1-Tag wie auch das erste h2-Tag inkludiert sind (hier in ein div). Kann mir jemand einmal erklären, warum der Fehler nicht auftritt, wenn das erste h1 nicht in ein div inkludiert ist. (siehe h1-divh1.png und h1-h1.png)
Ich hatte den Counter so verstanden, dass er als Singleton im Dokument fungiert und unabhängig von der DOM-Struktur funktioniert, wie das integrierte DIV-Beispiel es ja auch zeigt, wobei ich die Konfliktösung bei '4.1. div' und '4.1. subdivv' im Screenshot auf den ersten Blick ohne tieferes Hineindenken nachvollziebar erscheint.
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Überschriften-Nummerierung</title>
<style>
div {
counter-increment: divvy;
counter-reset: subdivvy;
}
div div {
counter-increment: subdivvy;
/*counter-reset: subchapter;*/
}
body {
counter-reset: chapter;
}
h1 {
counter-increment: chapter;
counter-reset: subchapter;
}
h2 {
counter-increment: subchapter;
counter-reset: subsubchapter;
}
h3 {
counter-increment: subsubchapter;
counter-reset: lastchapter;
}
h4 {
counter-increment: lastchapter;
counter-reset: lastsubchapter;
}
h5 {
counter-increment: lastsubchapter;
}
div::before {
content: counter(divvy) ": ";
font-weight: bold;
}
div div::before {
content: counter(divvy) "." counter(subdivvy) ": ";
font-weight: bold;
}
h2::before {
content: counter(subchapter) " ";
font-weight: bold;
}
h3::before {
content: counter(subchapter) "." counter(subsubchapter) " ";
font-weight: bold;
}
h4::before {
content: counter(subchapter) "." counter(subsubchapter) "." counter(lastchapter) " ";
font-weight: bold;
}
h5::before {
content: counter(subchapter) "." counter(subsubchapter) "." counter(lastchapter) "." counter(lastsubchapter) " ";
font-weight: bold;
}
</style>
</head>
<body>
<div>
div
<div>
subdivv
</div>
</div>
<!--<div>div für h1-->
<h1>h1: Kapitelüberschrift</h1>
<!--</div>-->
<div>
div
<div>
subdivv
</div>
</div>
<div> ups-outer-div
<div>
div
<div>
subdivv
</div>
</div>
</div>
<div>div für h2
<h2>h2: Erstes Unterkapitel</h2>
</div>
<h3>h3: Erster Abschnitt</h3>
<h4>h4: Detail 1</h4>
<div>
<h5>h5: Unterdetail h5</h5>
</div>
<h3>h3: Zweiter Abschnitt</h3>
<h4>h4: Detail 2</h4>
<h2>h2: Zweites Unterkapitel</h2>
<div>div für h1
<h1>h1: Kapitelüberschrift</h1>
</div>
<div>div
<h2>h2: Erstes Unterkapitel</h2>
</div>
<div>div
<h3>h3: Erster Abschnitt</h3>
</div>
<div>div
<h4>h4: Detail 1</h4>
</div>
<div>div
<h5>h5: Unterdetail h5</h5>
</div>
<h3>h3: Zweiter Abschnitt</h3>
<h4>h4: Detail 2</h4>
<h2>h2: Zweites Unterkapitel</h2>
<h3>h3: Erster Abschnitt</h3>
<h4>h4: Detail 4</h4>
<div>div
<h5>h5: Detail 5</h5>
<h6>h6: Detail 6</h6>
</div>
<h3>h3: Erster Abschnitt</h3>
<h4>h4: Detail 1</h4>
<h5>h5: Unterdetail</h5>
<h3>h3: Zweiter Abschnitt</h3>
<h4>h4: Detail 2</h4>
<h2>h2: Zweites Unterkapitel</h2>
<h3>h3: Erster Abschnitt</h3>
<h4>h4: Detail 1</h4>
</body>
</html>
Es ist genau das, was ich gesucht habe. Die Extension sieht richtig aufgeräumt aus. Ich muss sagen, dass die Extension sicher mehr verdient hat als nur die knapp 4600 User.
. (Php, Mysql, MDN, TYPO3 Drupal, Cypress, jQuery, React, ...) Bislang ärgere ich mich darüber, dass der Impact bei Google immer seichter wird. Warum habe ich die Frage nicht schon viel früher gestellt 
?
.
