pixxma: HTML5-Verwirrung: main vs. div, sectioning vs. grouping

Beitrag lesen

Guten Morgen,

meine Site hat folgenden HTML5-Grundaufbau:

header
main
  section
  article
  article
  article
footer

Das root-Element html hat über CSS eine Hintergrundfarbe. Das soll der Haupthintergrund des Dokumentes sein bis unten hin zum footer. Der footer bekommt über CSS eine eigene Hintergrundfarbe. Unerwünschtes Ergebnis: die footer-Hintergrundfarbe erstreckt sich vom footer aus nach oben über den kompletten main-Bereich! Nur der header hat die Hintergrundfarbe von html:-(

Wenn ich main durch div ersetze, klappt es wie gewünscht!

Liegt es bei main daran, dass es kein sectioning-Element, sondern ein grouping-Element ist? Aber div ist doch auch ein grouping-Element!? Warum klappt es beim einen und beim anderen nicht?

Und wie soll man auf sectioning-Ebene den Hauptinhalt eines Dokumentes auszeichnen? Oder ist das gar nicht vorgesehen?

MfG

pixxma