Gunther: CSS Box Model - Ansatz nicht ideal!?

Beitrag lesen

Hallo Thomas,

Mag ja sein, dass ich etwas 'begriffsstutzig' bin,_aber_dann poste doch bitte mal ein konkretes (Code-)Beispiel, für ein DIV-Element, welches bei jeder Fenstergröße nach oben einen Abstand von 100px, nach rechts von 20px, nach unten von 30px, und nach links von 160px hat (mal abgesehen davon, ob es einen Browser gibt, der das richtig darstellt - also rein nach Standard).

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
   <head>
      <meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
      <title>
         Untitled
      </title>
      <style type="text/css">
      html, body { width:auto; height:100%; padding-top:100px; padding-right:20px; padding-bottom:30px; padding-left:160px; margin:0px; border:0px; background:#ccc; }
      #box1 { height:inherit; width:inherit; padding:0px; margin:0px; border:solid 1px green; }
      </style>
   </head>
   <body>
      <div id="box1">
            für ein DIV-Element, welches bei jeder Fenstergröße nach oben einen Abstand von 100px,
     nach rechts von 20px, nach unten von 30px, und nach links von 160px hat (mal abgesehen davon,
     ob es einen Browser gibt, der das richtig darstellt - also rein nach Standard).
      </div>
   </body>
</html>

Opera 7.03 Stellt es richtig dar.

Nö,nö...! So nicht ;-)

html, body { width:auto; height:100%; padding-top:100px; padding-right:20px; padding-bottom:30px; padding-left:160px; margin:0px; border:0px; background:#ccc; }

Du trickst hier aber rum, denn das HTML-Element ist das Document-Root-Element und
----------------------------------- [Zitat(e) Anfang] -------------------------------------------
"The CSS box model describes the rectangular boxes that are generated for elements in the document tree ..."

"Document tree
The tree of elements encoded in the source document. Each element in this tree has exactly one parent, with the exception of the root element, which has none.
"

"The root of the document tree generates a box that serves as the initial containing block for subsequent layout.
The width of the initial containing block may be specified with the 'width' property for the root element. If this property has the value 'auto', the user agent supplies the initial width (e.g., the user agent uses *the current width of the viewport)."
----------------------------------- [Zitat(e) Ende] -------------------------------------------
So und nach der Theorie ist der Viewport wie breit (siehe *)? "The current width of the viewport" und das sind bei mir 100%. Folglich müssten deine Padding-Angaben noch obendrauf gerechnet werden (nach dem Box Model), also zeigt es OP7 nur vermeintlich richtig an, da Opera7 das Box Model falsch interpretiert im Bezug auf das HTML-Element (nämlich eigentlich genau nach dem MS-Ansatz).

Und hier sind wir eigentlich auch schon bei einem anderen Thema, nämlich dem HTML- und BODY-Element. Darüber gibt es auch schon einen kurzen Thread von mir mit Cheatah (http://forum.de.selfhtml.org/archiv/2003/3/42044/).
Hierbei besteht im Prinzp das selbe Problem, wie bei vielen anderen Dingen auch, nämlich bei der Browserimplementierung - jeder macht es wieder ein bis'chen anders, und eigentlich keiner richtig.

Ich finde gerade im Bezug auf das HTML-Element legt sich das W3C auch nicht genau fest (jedenfalls habe ich keine 'exakte' Aussage gefunden - vielmehr dreht man sich im Kreis, wenn man den jeweiligen Links folgt, ohne dabei jedoch eine 'eindeutige' Definition zu finden). Ich kann mir gut vorstellen, dass dies u.a. ein Grund mit dafür ist, dass selbst neuere Browser solche Unterschiede in der Darstellung/Umsetzung von validem Code produzieren.

Ich bin nach wie vor der Meinung, dass das derzeitige Box Model zumindest nicht ideal ist (man könnte auch sagen 'unlogisch', bzw. dass zusätzliche Eigenschaften her müssen).

Auf jeden Fall danke ich dir noch mal für deine Mühe, Ausdauer, und Geduld. Bitte sei nicht 'enttäuscht' darüber, dass du mich (zumindest bis jetzt) nicht von (d)einer anderen Meinung überzeugt hast ;-). Ich möchte nicht, dass der Eindruck entsteht, ich 'wollte' mich nicht überzeugen lassen. Dies ist_keineswegs_der Fall.

Gruß Gunther