Gunnar Bittersmann: CSS und Drucker

Beitrag lesen

@@TS

Hingegen funktioniert break-before ausgezeichnet. Allerdings möchte ich diese Anweisung für die jeweils erste H2 nach einer H1 nicht umgesetzt haben. Was muss ich da schreiben?

Das hängt – Überraschung! – von deinem Markup ab. Hast du die Abschnitte als section ausgezeichnet? Oder hast du Spaghetti-Code à la

	<h1>Allgemeine Erklärung der Menschenrechte</h1>
	<h2>Artikel 1</h2>
	<p>Alle Menschen sind  frei und gleich an Würde und Rechten geboren. Sie sind mit Vernunft und  Gewissen begabt und sollen einander im Geiste der Brüderlichkeit begegnen.</p>
	<h2>Artikel 2</h2>

Im zweiten Fall kannst du eine für alle h2 gesetzte Eigenschaft für die unmittelbar nach h1 folgende zurücksetzen, bspw.:

h2 { break-before: page }

h1 + h2 { break-before: revert }

Das geht freilich nur, wenn zwischen h1 und h2 kein anderer Inhalt ist.

Besser dran bist du also mit

h2 { break-before: page }

h2:first-of-type { break-before: revert }

Noch besser: Du setzt die Eigenschaft für die erste h2 gar nicht erst:

h2:not(:first-of-type) { break-before: page }

Beispiel (dort für margin-top)


Im ersten Fall, wenn du deinen Inhalt ordentlich strukturiert hast

	<h1>Allgemeine Erklärung der Menschenrechte</h1>
	<section>
		<h2>Artikel 1</h2>
		<p>Alle Menschen sind  frei und gleich an Würde und Rechten geboren. Sie sind mit Vernunft und  Gewissen begabt und sollen einander im Geiste der Brüderlichkeit begegnen.</p>
	</section>
	<section>
		<h2>Artikel 2</h2>

kannst du die h2 aller Abschnitte außer des ersten per
section:not(:first-of-type) h2 selektieren.

Brauchst du aber nicht, sondern nicht auf die Überschriften, sondern gleich auf die Abschnitte anwenden:

section:not(:first-of-type) { break-before: page }

Beispiel (dort für margin-top)

🖖 Живіть довго і процвітайте

--
When the power of love overcomes the love of power the world will know peace.
— Jimi Hendrix