nicht angemeldet
Welches ist das Root-Element?
Liebes Forum,
welches ist jetzt eigentlich das Root-Element einer HTML-Datei? Unter http://www.w3.org/TR/html401/index/elements.html wird "HTML" als "document root element" bezeichnet. Das eigentlich war es, was ich auch immer gedacht hatte.
Jetzt heißt es aber bei http://www.w3.org/TR/REC-CSS2/visudet.html#containing-block-details unter Punkt 1:
"The containing block (called the initial containing block) in which the root element lives is chosen by the user agent."
Sofern hier mit Root-Element das HTML-Element gemeint wäre, müsste dann das HTML-Element doch eine ganz normale Box bilden mit Content-, Padding-, Border- und Margin-Bereichen.
Lesen wir an derselben Stelle weiter bei Punkt 2:
"For other elements, unless the element is absolutely positioned, the containing block is formed by the content edge of the nearest block-level ancestor box."
Das würde, obiges konsequent weitergedacht, heißen, der Containing-Block des Body-Elements wird durch den Content-Bereich des HTML-Elements gebildet.
Dem widerspricht nun aber das nächstfolgende Beispiel ein paar Zeilen weiter unten. In der Tabelle wird der Conatining-Block des Body-Elements direkt als Initial-Containing-Block bezeichnet.
Dem widerspricht auch meine bisherige Praxis, denn ich habe zwar öfters mal mit CSS auf das Body-Element zugegriffen und die Padding- oder Margin-Eigenschaft geändert, aber noch nie auf das HTML-Element.
Meine Frage(n):
Widersprechen sich hier die CSS und HTML Spezifikationen?
Wenn ja, welche hat (eurer Meinung nach) Recht?
Wenn nein, wo liegt mein Verständnisfehler?
Schon jetzt Danke und Gruß
Pidder Lüng
-
Liebes Forum,
bei meinen "Grundlagenforschungen" in der CSS2 Spezifikation muss ich jetzt noch einen drauf setzen:
Ich habe nachfolgenden Code aus der Spezifikation kopiert und durch Farben die Border-, Padding- und Margin-Bereiche sichtbar gemacht. Zum nachvollziehen für euch hier der Code:
<!doctype html public "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>Test zur CSS-Spec</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<link rel="stylesheet" type="text/css" href="layout.css">
<style type="text/css">
<!--
body {font-size:50px}
#body {background-color:yellow;padding:0px;border:3px solid black;height:500px;margin:10px}
#div1 {background-color:green;padding:0px;border:5px solid red;margin:0px}
#p1 {background-color:cyan;padding:0px;border:1px solid black;margin:0px}
#p2 {background-color:blue;padding:0px;border:1px solid black;margin:0px}
#strong1 {background-color:violet;padding:0px;border:1px solid black;margin:0px}
#em1 {background-color:magenta;padding:0px;border:1px solid black;margin:0px}
-->
</style>
</head>
<BODY id="body">
<DIV id="div1">
<P id="p1">This is text in the first paragraph...</P>
<P id="p2">This is text
<EM id="em1"> in the
<STRONG id="strong1">second</STRONG>
paragraph.
</EM>
</P>
</DIV>
</BODY>
</html>Die Grundüberlegung: Der Containing Block für die Box, die vom Body-Element gebildet wird, ist der vom User-Agent bestimmte Initial-Containing-Block (so jedenfalls laut der Beispiel-Tabelle in der CSS-Spec). In diesem Containing-Block sitzt jetzt die komplette Box des Body-Elements, also mit Margin-, Border-, Padding- und Content-Bereich. Die Grund-Hintergrundfarbe der Browser (ich teste mit IE6, Mozilla 1.0, Opera 6, alle auf WIN98) ist weiß.
Wenn ich jetzt dem Body-Element eine Hintergrundfarbe zuweise, so dürften nur Content- und Padding-Bereich eingefärbt werden. Tatsächlich wird aber auch der Margin-Bereich (bei Opera6) und sogar der ganze Containing-Block (bei IE6 und Mozilla 1.0) eingefärbt.
Meine Fragen:
Seht ihr hier auch Unstimmigkeiten in der Spezifikation bzw. bei deren Umsetzung durch die Browser?
Oder gehe ich gedanklich hier in die Irre und wenn ja, könnt ihr mir helfen, die Gedanken richtig zu stellen?Dem Verhalten von IE6 und Mozilla gemäß müßte das Body-Element selber der Initial-Containing-Block sein. Das aber widerspricht m.E. der CSS2 Spezifikation und auch der Browser-Praxis, denn wozu braucht ein Containing-Block noch einen Margin-Bereich?
Erstmal denjenigen vielen Dank, die dieses lange Posting bis hierher gelesen und versucht zu verstehen haben. Ich würde mich über einen Austausch mit euch sehr freuen.
Viele Grüße
Pidder Lüng
-
#body {background-color:yellow;padding:0px;border:3px solid black;height:500px;margin:10px}
Die Grund-Hintergrundfarbe der Browser (ich teste mit IE6, Mozilla 1.0, Opera 6, alle auf WIN98) ist weiß.
Wenn ich jetzt dem Body-Element eine Hintergrundfarbe zuweise, so dürften nur Content- und Padding-Bereich eingefärbt werden. Tatsächlich wird aber auch der Margin-Bereich (bei Opera6) und sogar der ganze Containing-Block (bei IE6 und Mozilla 1.0) eingefärbt.
Das sieht mir in der Tat nach einem Fehler aus. Wenn Du Deinem Stylesheet noch ein "html {background-color:white}" hinzufügst, wird der Margin-Bereich nämlich weiß, d.h. dort ist noch etwas, was vorher fälschlicherweise gelb eingefärbt wurde, obwohl doch die Benutzerangaben über denen der Webseite stehen sollten.
Dem Verhalten von IE6 und Mozilla gemäß müßte das Body-Element selber der Initial-Containing-Block sein. Das aber widerspricht m.E. der CSS2 Spezifikation und auch der Browser-Praxis, denn wozu braucht ein Containing-Block noch einen Margin-Bereich?
Warum soll er keinen haben? Gleiches Recht für alle :) Mit "containing block" ist erstmal nur das Element gemeint, daß das aktuelle beinhaltet.
Gruß,
soenk.e-
Hallo Sönke,
erstmal vielen Dank für deine Antwort. Ich hatte schon die Befürchtung, dass alle meine Fragen für zu "theoretisch" halten oder ich mich so kompliziert ausgedrückt habe, dass keiner das Problem versteht.
Dem Verhalten von IE6 und Mozilla gemäß müßte das Body-Element selber der Initial-Containing-Block sein. Das aber widerspricht m.E. der CSS2 Spezifikation und auch der Browser-Praxis, denn wozu braucht ein Containing-Block noch einen Margin-Bereich?
Warum soll er keinen haben?
Ich zitiere die CSS-Spezifikation: "The position and size of an element's box(es) are sometimes computed relative to a certain rectangle, called the containing block of the element." http://www.w3.org/TR/REC-CSS2/visudet.html#containing-block-details
Hier ist von einem "certain rectangle" die Rede, nicht von einer CSS-Box mit allem, was dazu geört. Also ein schlichtes Rechteck, bei dem eigentlich nur die Fläche zählt. Dies bestätigt sich m.E., wenn man weiterliest:
"For other elements ... the containing block is formed by the content edge of the nearest block-level ancestor box."
Das Schlüsselwort ist hier die "content-edge", welche den Containing-Block begrenzt. Padding, Border und Margin bleiben außen vor.Gleiches Recht für alle :)
Politisch gesehen hast du recht :)
Mit "containing block" ist erstmal nur das Element gemeint, daß das aktuelle beinhaltet.
Was ich meine, mit den obigen Zeilen widerlegt zu haben. Womit ich mir natürlich nicht sicher bin und ich mich deshalb im Interesse der relativen (ich will hier ja nicht religiös werden) "Wahrheitsfindung" darüber freuen würde, wenn du deine Aussage begründest.
Viele Grüße
Pidder Lüng
-
Dem Verhalten von IE6 und Mozilla gemäß müßte das Body-Element selber der Initial-Containing-Block sein. Das aber widerspricht m.E. der CSS2 Spezifikation und auch der Browser-Praxis, denn wozu braucht ein Containing-Block noch einen Margin-Bereich?
Warum soll er keinen haben?
Ich zitiere die CSS-Spezifikation: "The position and size of an element's box(es) are sometimes computed relative to a certain rectangle, called the containing block of the element." http://www.w3.org/TR/REC-CSS2/visudet.html#containing-block-details
Hier ist von einem "certain rectangle" die Rede, nicht von einer CSS-Box mit allem, was dazu geört. Also ein schlichtes Rechteck, bei dem eigentlich nur die Fläche zählt.Das besagt nicht mehr, als das Position und Größe eines Elements von den Dimensionen des Elternelements abhängen, genauer gesagt den inneren. Das schließt aber doch nicht aus, daß das Elternelement keine Randbereiche haben _darf_?
Und selbiges gilt natürlich auch für den Sonderfall des obersten Elements. Daß da irgendwo etwas nicht so ganz stimmt in Bezug auf das Ausfüllen mit dem Hintergrund, hatte ich ja schon geschrieben.Das besondere am obersten Element ist allerdings, daß es ja nicht im luftleeren Raum schwebt, sondern im Anzeigebereich des Browsers. Und für den macht es in der Tat keinen Sinn, Abstände oder einen Rahmen zu besitzen. Nichtsdestotrotz bestimmt der Anzeigebereich aber selbstverständlich die äußersten Dimensionen des obersten Elements, des "initial containing blocks". Davon ausgehend kann das oberste Element aber mit allem drum und dran ganz normal gezeichnet werden, wie alle anderen Elemente auch, also verfügbare Fläche, davon abgezogen werden margin, border und padding und der Rest ist width bzw. height.
Was mir noch einfällt: Was der "initial containing block" ist, darf laut Spezifikation ja der Browser bestimmen. Vielleicht kommt daher auch die ein oder andere Ungereimtheit.
Gruß,
soenk.e-
Hallo Sönke,
leider bin ich jetzt etwas in Eile, als dass ich noch ausführlich antworten könnte. Ich will mich aber auch nicht im Kreise drehen, daher gehe ich nur auf eine Stelle deines Postings ein:
Nichtsdestotrotz bestimmt der Anzeigebereich aber selbstverständlich die äußersten Dimensionen des obersten Elements, des "initial containing blocks". Davon ausgehend kann das oberste Element aber mit allem drum und dran ganz normal gezeichnet werden...
Meiner Ansicht nach sind Anzeigebereich und "initial containing block" gleichzusetzen, nicht aber "initial containing block" und oberstes Element. Denn warum spricht das W3C sonst nirgends davon, dass es sich bei dem "initial containing block" letztlich auch um eine ganz normale Box handelt?
Was mir noch einfällt: Was der "initial containing block" ist, darf laut Spezifikation ja der Browser bestimmen. Vielleicht kommt daher auch die ein oder andere Ungereimtheit.
Das ist gewißlich wahr :) Scheiß Liberalismus! :))
Danke für das Gespräch, ich fand's nett.
Viele Grüße
Pidder Lüng
-
-
-
-