nicht angemeldet
Default Abstand von h1 und p
Hallo Forum,
ich arbeite an einem Layout, welches unter http://www.ronald-pottkaemper.de/test2/ anzusehen ist.
Es geht um das mittlere, orangefarbene DIV (maincontent) in welchem die h1 "Hauptinhalt" definiert ist. Dieses DIV hat einen Abstand nach oben, obwohl die zugehörende id (maincontent) ein margin nur nach links und rechts definiert hat.
Wenn ich dem h1-Tag in (maincontent) margin 0 zuweise, ist der Abstand weg.
Gleiches gilt auch für das p-Tag. wenn ich h1 komplett herausnehme ist der Effekt auf das p-Tag der selbe.
Nun meine Frage: Wie können die default-Werte von h1 und p sich über den Container auswirken in dem sie sich befinden?
Bei den beiden anderen DIV's, sidebar1 und sidebar2 ist das nicht der Fall, anscheinend weil diese über float left bzw. right ausgerichtet sind.
Viele Grüße,
Ronald
-
Yerf!
Nun meine Frage: Wie können die default-Werte von h1 und p sich über den Container auswirken in dem sie sich befinden?
Das Stichwort lautet "collapsing Margins". Die oberen Abstände des Divs und der H1 werden zusammengefasst (der größere gewinnt) und dann dem äußeren Element zugewiesen. Verhidnern kannst du das entweder durch einen Rahmen dazwischen oder durch Padding anstatt von Margin bei der H1.
Gruß,
Harlequin
-
Warum passiert das dann bei den beiden anderen DIVs (sidebar1 und sidebar2) nicht? Diese haben kein margin zugewiesen und haben als Überschrift h3. Nehme ich die margin für den maincontent div heraus, ändert sich am Abstand zum oberen Div nichts. Das sieht für mich also erst einmal so aus, dass DIV's die mit float left oder right definiert sind von collapsing margins nicht betroffen sind?
Ronald
-
-
Es geht um das mittlere, orangefarbene DIV (maincontent) in welchem die h1 "Hauptinhalt" definiert ist. Dieses DIV hat einen Abstand nach oben, obwohl die zugehörende id (maincontent) ein margin nur nach links und rechts definiert hat.
Wenn ich dem h1-Tag in (maincontent) margin 0 zuweise, ist der Abstand weg.
Gleiches gilt auch für das p-Tag. wenn ich h1 komplett herausnehme ist der Effekt auf das p-Tag der selbe.
Nun meine Frage: Wie können die default-Werte von h1 und p sich über den Container auswirken in dem sie sich befinden?Informiere Dich über Collapsing Margins.
Andreas a/k/a MudGuard
-
Hallo MudGuard,
habe mir einiges zu Collpasing Margins angeschaut und es soweit auch verstanden. Ich habe nur immer noch ein Verständnisproblem warum sich dieses margin der H1 nur in einem der Div's, nämlich maincontent auswirkt.
Ich habe einen umgebenden Div (container) einen Div (header) und darunter befinden sich dann sidebar 1, sidebar 2 und maincontent.
Also:
<div id="container">
<div id="header"></div>
<div id="sidebar1"></div>
<div id="sidebar2"></div>
<div id="maincontent"></div>
<div id="footer"></div>
</div>Optisch erscheint der maincontent mittig, da sidebar 1 und sidebar 2 jeweils auf float left und right gesetzt sind. Sämtliche Div's verfügen über kein margin, mit Ausnahme des äußeren Containers, der über margin mittig im body platziert wird.
Grüße
Ronald
-
-
Hi,
weil ich mich in der Vergangenheit zu oft mit den margins und padding und den verschiednen Ansichten in verschiedenen Browsern unter verschiedenen Doctypes geärgert hatte, nutze ich seitdem:
*{margin:0;padding:0;}
Und lege für die einzelnen Elemente gezielt die Abstände neu an.
Seitdem habe ich Ruhe.
Peter