Abstand zwischen h1 u. h2

[Tanja König]

Hallo liebes Forum,

ich benutze h1, h2 und p zur Textformatierung.
Ich habe folgendes Problem:
<h1>Blindtext</h1>
<h2>Blindtext>/h2>
<p>Blindtext.</p>

Wie kann ich mit CCS den Abstand zwischen h1 und h2 steuern?
Das gleiche zwischen h2 und p.

Gruss
Tanja

[Orlando]

Hi Tanja,

<h1>Blindtext</h1>
<h2>Blindtext>/h2>
<p>Blindtext.</p>

Wie kann ich mit CCS den Abstand zwischen h1 und h2 steuern?

h1 { margin-bottom: ... }

Das gleiche zwischen h2 und p.

Wie oben, nur mit h2 als Selektor.

Grüße,
 Roland

[Tanja König]

Hallo Roland,

Danke für die schnelle Hilfe.
Leider funktioniert das nicht so wie gewünscht.
Mit deiner Funktion kann ich den Abstand vergrößern, ich will aber den Abstand zwischen h1 und h2 verkleinern.

Andere Lösung?

Gruß
Tanja

[Thomas Luethi]

Hallo,

Leider funktioniert das nicht so wie gewünscht.
Mit deiner Funktion kann ich den Abstand vergrößern, ich will aber den Abstand zwischen h1 und h2 verkleinern.

Wenn Du anfaengst, an den Abstaenden rumzuschrauben,
gibt das viel Arbeit. Meist musst Du die Abstaende aller
betroffenen Elemente definieren, denn die margin-Werte
werden zusammengezaehlt, und die Browser haben
standardmaessig fuer die meisten Block-Level-Elemente
(z.B. H1, H2, P) gewisse Werte vorgesehen.

Beschaeftige Dich ernsthaft mit CSS, insbesondere mit dem
"Box Model" und margin/border/padding, dann
kannst Du das Problem selbst loesen.

Gruesse,

Thomas

[Tanja König]

Hallo Thoams,

auf diese dumme Art von Kommentare:

Beschaeftige Dich ernsthaft mit CSS, insbesondere mit dem
"Box Model" und margin/border/padding, dann
kannst Du das Problem selbst loesen.

kann ich verzichten !!!!

Deshalb bin ich hier, weil ich es NICHT selbst lösen kann.
(auch noch keine Hilfe gefunden habe)

Gruß
Tanja

[Cheatah]

Hi,

auf diese dumme Art von Kommentare:

[...]

kann ich verzichten !!!!

dann empfehle ich Dir, Dich nach einer anderen Zielgruppe umzusehen. Auf Leute, die sich nicht die Mühe machen wollen, ihre Probleme mit Hilfe anderer selbst (engl.: _self_) zu lösen, können wir nämlich verzichten.

Deshalb bin ich hier, weil ich es NICHT selbst lösen kann.

Du bist hier um zu lernen, wie Du es selbst lösen kannst - oder Du bist hier falsch. Recherchiere zudem bitte im Archiv, was Terry Pratchett zu multiplen Ausrufezeichen zu sagen hatte.

Cheatah

[Michael Jendryschik]

Hallo,

Du bist hier um zu lernen, wie Du es selbst lösen kannst - oder Du bist hier falsch. Recherchiere zudem bitte im Archiv, was Terry Pratchett zu multiplen Ausrufezeichen zu sagen hatte.

Ich finde, du könntest es ruhig mal wieder schreiben. Die meisten Treffer auf die Sucheingabe »Terry Pratchett Ausrufezeichen« sind Beiträge von dir, in denen du auf das Archiv verweist...

Gruß,

MI

[Thomas Luethi]

Hallo,

Deshalb bin ich hier, weil ich es NICHT selbst lösen kann.
(auch noch keine Hilfe gefunden habe)

Was steht ueber diesem Forum (auf http://forum.de.selfhtml.org/)?
"Es wird erwartet, daß bei Problemen erst einmal in SELFHTML,
im Ordner Forumsarchiv oder in anderen Quellen nach einer
Loesung gesucht wird."

In SelfHTML gibt es zu diesem Thema z.B.
http://selfhtml.teamone.de/css/eigenschaften/randabstand.htm
Und "andere Quellen" sind z.B. die Spezifikationen des W3C, z.B.
http://www.w3.org/TR/REC-CSS2/box.html
insbesondere der Abschnitt "collapsing margins":
http://www.w3.org/TR/REC-CSS2/box.html#collapsing-margins
Deutsch: http://edition-w3c.de/TR/1998/REC-CSS2-19980512/kap08.html#heading-8.3.1�

Nach Lektuere dieser Seiten solltest Du das "Box Model"
im grossen Ganzen begriffen haben und anwenden koennen;
wenn Du dann immer noch Detailfragen oder Probleme hast,
kannst Du gerne wiederkommen, und wir helfen Dir weiter.

Gruesse,

Thomas

[Michael Jendryschik]

Hallo,

Beschaeftige Dich ernsthaft mit CSS, insbesondere mit dem
"Box Model" und margin/border/padding, dann
kannst Du das Problem selbst loesen.

Deshalb bin ich hier, weil ich es NICHT selbst lösen kann.

Auf http://jendryschik.de/wsdev/einfuehrung/css/box-modell.html habe ich versucht, das Box-Modell so knapp wie möglich zu erklären. Wenn du diese Seite nicht lesen willst (und auch nicht den entsprechenden Teil in SelfHTML), weil du nur darauf wartest, dass dir hier eine Musterlösung für dein Problem auf dem Silbertablett serviert wird, bist du hier falsch, ansonsten kannst du gern noch einmal nachfragen, was konkret du nicht verstanden hast.

Gruß,

MI

[Ingo]

Hi,

Auf http://jendryschik.de/wsdev/einfuehrung/css/box-modell.html habe ich ...

...gerade mal reingeschaut. Schön übersichtlich. Nur zur Info, Du solltest:
margin: 1em 2em 3em;     /* oben: 1em, links und rechts: 2em, rechts 3em   */
und weiter unten dasselbe vielleicht mal korrigieren.
freundliche Grüße
Ingo

[Michael Jendryschik]

Hallo,

Du solltest:
margin: 1em 2em 3em;     /* oben: 1em, links und rechts: 2em, rechts 3em   */
und weiter unten dasselbe vielleicht mal korrigieren.

Natürlich. Vielen Dank für den Hinweis.

Gruß,

MI

[Orlando]

Hi Tanja,

Leider funktioniert das nicht so wie gewünscht.
Mit deiner Funktion kann ich den Abstand vergrößern, ich will aber den Abstand zwischen h1 und h2 verkleinern.

Wenn positive Werte den Abstand vergrößern, welche verkleinern ihn dann? ;-)

Andere Lösung?

Nein, die passt schon.

Grüße,
 Roland

[Michael Jendryschik]

Hallo,

Mit deiner Funktion kann ich den Abstand vergrößern, ich will aber den Abstand zwischen h1 und h2 verkleinern.

h1, h2 {
   margin: 0;
}

Gruß,

MI

[netzrose]

Hallo Tanja,

<h1>Blindtext</h1>
<h2>Blindtext>/h2>
<p>Blindtext.</p>

Wie kann ich mit CCS den Abstand zwischen h1 und h2 steuern?

h1 { margin-bottom: ... }

hm, geht aber glaube ich dann erst wunschgemäß, wenn top noch dazu kommt:
margin-top:20px;
margin-bottom:0px;

Tanja, wenn Du magst, kannst Du das gerade in dem weiter unten erwähnten Dokument nachvollziehen:
ohne css http://urheberg.abmahnung.de/urhg-linux.html und dagegen
http://urheberg.abmahnung.de/urhg.html
Da fällt besonders schön h5 auf - hängt nämlich ohne, wie ein Schluck wasser zwischen Textabsätzen. ;-)

cu

netzrose

[fastix®]

Moin!

Wie kann ich mit CCS den Abstand zwischen h1 und h2 steuern?
Das gleiche zwischen h2 und p.

Du kannst jedem Element mit margin-top|left|right|bottom Abstände zu anderen Elementen auf den Weg geben.

Wenn jetzt zwei Block-Elemente nacheinander aufgeführt werden: welchen Abstand haben diese voneinander: Richtig: margin-bottom von Element(1) + margin-top von Element(2).

Zuletzt solltest Du wissen, dass die Browser immer dann, wenn Du eine Eigenschaft nicht bestimmst, die Browser diese Eigenschaft aus dem mitgelieferten oder eingestellten Stylesheet festlegen.

So kann ein Element einen margin-bottom haben, den Du nicht festgelegt hast. Alles klar?

MFFG (Mit freundlich- friedfertigem Grinsen)

fastix®

[MudGuard]

Hi,

Wenn jetzt zwei Block-Elemente nacheinander aufgeführt werden: welchen Abstand haben diese voneinander: Richtig: margin-bottom von Element(1) + margin-top von Element(2).

Falsch.
Richtig ist: max(margin-bottom von Element(1), margin-top von Element(2))

da vertikale margins kollabieren, wenn beide Boxen Blöcke sind und im normalen Fluß ausgegeben werden (so wie hier bei h2 nach h1).

http://www.w3.org/TR/REC-CSS2/box.html#collapsing-margins

cu,
Andreas