Abstand nach jedem <p> vor <h1> vergrößern
Regina Flower
- html
Hallo!
Nach jedem Paragraphen habe ich mittels margin-bottom einen Abstand nach unten eingestellt. Steht allerdings ein Paragraph <p> vor einer Überschrift <h1>, <h2>, <h3>, <h4>, so würde ich den Abstand gerne vergrößern.
Ich habe ein wenig mit CSS-Selektoren herum gespielt, aber leider keine Lösung für meinen Wunsch gefunden. Könnt ihr mir weiterhelfen?
Tschüss
Regina
Hallo Regina,
Nach jedem Paragraphen habe ich mittels margin-bottom einen Abstand nach unten eingestellt. Steht allerdings ein Paragraph <p> vor einer Überschrift <h1>, <h2>, <h3>, <h4>, so würde ich den Abstand gerne vergrößern.
versuch's von der anderen Seite anzugehen: Gib dem hx-Element den gewüschten Abstand nach oben, wenn es unmittelbar auf ein p-Element folgt. Dafür bietet CSS den Adjacent-Sibling-Selektor (im Deutschen vermutlich Geschwister-Selektor):
p+h1
Selektiert jedes h1-Element, das unmittelbar auf ein p-Element folgt.
Beachte beim Festlegen der Abstände dann die heimtückische Stolperfalle "Collapsing Margins": Top- und Bottom-Margins zweier Element fallen unter bestimmten Umständen zusammen, so dass nur noch der größere der beiden Abstände wirksam ist.
So long,
Martin
Fein, danke für die Hilfe. Damit komme ich weiter. :)
@@Regina Flower:
nuqneH
Steht allerdings ein Paragraph <p> vor einer Überschrift <h1>, <h2>, <h3>, <h4>, so würde ich den Abstand gerne vergrößern.
Das geht nicht.
Den Überschriften einen Abstand nach oben zu geben, das geht. Und ürfte denselben Effekt haben.
Qapla'