Absatzformatierungen mit CSS

Dieses Thema im Forum "Web Page Design" wurde erstellt von Bastian, 01.04.2005.

  1. Bastian

    Bastian Thread Starter MacUser Mitglied

    Beiträge:
    536
    Zustimmungen:
    10
    MacUser seit:
    20.06.2003
    Hallo zusammen,

    ich stehe einmal mehr vor einem kleinen CSS-Problem. Vielleicht sehe ich auch vor lauter Bäumen den Wald nicht mehr... :)

    Also: Jede Seite hat bei mir einen Haupttitel, den ich mit h1 formatiere. Das h1-Element kommt nur einmal vor. Danach gibt es Abschnittsüberschriften mit h2 und h3 und den Fliesstext mit p.

    Wenn ich nun nach einem p-Abschnitt eine neue h2-Überschrift setzen will, klebt diese förmlich am p-Element des vorangehenden Absatzes. Eigentlich kein Problem: Ich definiere einen Abstand padding-top für h2. Doch dann habe ich das Problem, dass dieser Abstand auch dann zustande kommt, wenn die h2-Überschrift direkt nach dem h1-Titel folgt, was zu einer unschön grossen Lücke führt.

    Wer das alles verstanden hat und mir einen Tipp geben kann, darf gerne antworten.

    Merci
     
  2. Erika

    Erika MacUser Mitglied

    Beiträge:
    232
    Zustimmungen:
    0
    MacUser seit:
    03.01.2004
    Du musst Dich enscheiden, ob mit oder ohne Abstand.
    Hast Du eine Seite, die mit Hand gepflegt wird, dann setz doch einfach <br> ein.
    Sonst wirst Du wohl ein sript brauchen.

    Erika
     
  3. [BliZZarD]

    [BliZZarD] MacUser Mitglied

    Beiträge:
    93
    Zustimmungen:
    0
    MacUser seit:
    19.09.2003
    Fieser, aber funktionierender Workaround: Gib dem H1 ein padding-bottom im Minusbereich. ;)
     
  4. Colonel Panik

    Colonel Panik MacUser Mitglied

    Beiträge:
    169
    Zustimmungen:
    1
    MacUser seit:
    12.10.2004
    line-height probieren?!

    Wenn ich das richtig sehe, könntest Du das ganze durch einen line-height Befehl in den Griff bekommen:

    Beispiel eines zentralen CSS:

    #Text01 {
    line-height:9pt;
    font-style:Verdana;
    font-weight:normal;
    font-size:10px;
    font-family: Verdana, Helvetica, Tahoma, sans-serif;
    text-align:justify;
    margin-left:80px;
    margin-right:50px;
    margin-top:10px;
    }
     
    Zuletzt bearbeitet: 01.04.2005
  5. Bastian

    Bastian Thread Starter MacUser Mitglied

    Beiträge:
    536
    Zustimmungen:
    10
    MacUser seit:
    20.06.2003
    Danke für eure Antworten.

    Das mit dem Minuswert für das h1-Tag funktioniert dann aber nicht mehr, wenn nach h1 direkt ein p-Absatz folgt. Leider.

    Ich denke, ich werde nach einem p-Absatz einfach eine oder zwei Leerzeilen zwischenschalten lassen. ;)
     
  6. Nogger

    Nogger MacUser Mitglied

    Beiträge:
    367
    Zustimmungen:
    0
    MacUser seit:
    03.08.2004
    /* Die Standardwerte sind browserspezifisch, also erstmal eine saubere Ausgangslage schaffen */

    h1, h2, h3, p
    {
    margin: 0;
    padding: 0;
    }

    p
    {
    margin-top: 0.5em;
    }

    h1, h2, h3
    {
    margin-bottom: 0.5em;
    }

    Durch "collapsing margins" gilt als vertikaler Abstand zweier Elemente der höhere der beiden Werte "margin-bottom oberes Element" und "margin-top unteres Element". Siehe Erklärungen zum Box Model in der CSS2 Spezifikation.
     
Die Seite wird geladen...
Ähnliche Themen - Absatzformatierungen CSS
  1. hello
    Antworten:
    1
    Aufrufe:
    196
  2. Hoooray
    Antworten:
    2
    Aufrufe:
    266
  3. Kemna
    Antworten:
    6
    Aufrufe:
    524
  4. Saugkraft
    Antworten:
    5
    Aufrufe:
    604

Diese Seite empfehlen