[XHTML, CSS] Abstände...

**Namenloser**

Hallo,

ich hab mal wieder ein Problem, das ich überhaupt nicht verstehe... und zwar möchte ich auf meiner Seite einen farbigen Header haben, der über die ganze Bildschirmbreite geht und oben bündig abschließt (so ähnlich wie bei der DP). Dazu habe ich natürlich erst mal die Margins und Paddings der diversien <div>s und des <body> auf 0 gesetzt.
Nun befindet sich aber in dem Header noch eine Überschrift (<h1>-Tag), welche einen Margin > 0 hat, da sie natürlich nicht direkt am Rand kleben soll.

Nun führt das eigenartigerweise dazu, dass die Seite so gerendert wird, als ob der Header, nicht die Überschrift, das Margin > 0 hätte.

Um das ganze mal etwas anschaulicher zu machen, hier (verkürzt) der Code:

zusammenfalten · markieren

XML-Code:

			<html>

  <head>...<head>

  <body>

    <div id="wrapper">

      <div id="header">

        <h1>Test</h1>

      </div>

      <div id="main">

        ...

      </div>

    </div>

  </body>

</html>

markieren

Code:

			body, #wrapper, #header, #main {

  margin: 0px;

  padding: 0px;

}

#header { background: red; }

#wrapper { background: blue; }

#main { background: green; }

/* Das einzige Element mit margin != 0: */

h1 {

  margin-top: 50px;

  margin-bottom: 50px;

}

So sieht das Ergebnis aus (man beachte den großen weißen Abstand oben und darunter den blauen Bereich – beides sollte nicht da sein):
scr3987_20110706.png
Aussehen soll (und müsste es nach meiner Logik) aber so:
sosollteesaussehen.png

Ich habe dieses seltsame Verhalten sowohl in der Alpha des Firefox 6 als auch im IE9 festgestellt.

Live-Demo gibts hier (die gleiche Datei gibt’s auch noch mal zusätzlich im Anhang)

Danke im Voraus,
ich bin gerade ziemlich ratlos...

Themen-Optionen	Thema durchsuchen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen	Thema durchsuchen: Erweiterte Suche
Ansicht
Zur Linear-Darstellung wechseln Zur Hybrid-Darstellung wechseln Baum-Darstellung

[XHTML, CSS] Abstände...

[XHTML, CSS] Abstände...

Forumregeln