define offsetWidth/offsetHeight and client*; still lots of things to work out

Author: annevk

cssom/Overview.src.html

@@ -1748,54 +1748,67 @@ <h5><code>offsetLeft</code> and <code>offsetRight</code></h5>
 
   <h5><code>offsetWidth</code> and <code>offsetHeight</code></h5>
 
-  <p class="issue">It seems these are reasonable consistent with
-  <code>offsetLeft</code> and <code>offsetRight</code>... They basically
-  represent the border box of an element.</p>
+  <p>The <dfn><code>offsetWidth</code></dfn> attribute of element <var>A</var>
+  <em class="ct">must</em> be the number of pixels given by the border box
+  width<!--XXX ref-->.</p>
+
+  <p>The <dfn><code>offsetHeight</code></dfn> attribute of element <var>A</var>
+  <em class="ct">must</em> be the number of pixels given by the border box
+  height<!--XXX ref-->.</p>
 
   <p class="issue">In quirks mode "the body element" represents the viewport
   height and width here and in standards mode that would be "the html element"
   or root element.</p>
 
   <h4>The <code>scroll<var>*</var></code> attributes</h4>
 
-  <p class="issue">...</p>
+  <p class="issue">It seems scrollWidth and scrollHeight are defined by the
+  boxes they contain plus any the surrounding padding area. How about principle
+  box width/height + padding edge width. For inline boxes they are identical to
+  offsetWidth/offsetHeight it seems.</p>
 
   <h4>The <code>client<var>*</var></code> attributes</h4>
 
-  <p class="issue">These attributes are concerned about the "padding box"
-  excluding size taken up by scrollbars...</p>
-  <!--
-  The clientWidth and clientHeight of element A is the width and height of the padding box, excluding any horizontal or vertical scrollbar generated by the element.
-
-In strict mode clientWidth and clientHeight of the root element (HTML) is the viewport (initial containing block) width and height.
-
-In quirks mode clientWidth and clientHeight of the BODY element is the viewport (initial containing block) width and height. In quirks mode clientWidth and clientHeight of the root element (HTML) is viewport (initial containing block) width and root element padding height.
-
-What clientWidth and clientHeight are when A is an inline box is not defined.
+  <p>The <dfn><code>clientTop</code></dfn> attribute of element <var>A</var>
+  <em class="ct">must</em> be the computed value of the
+  <code>border-top-width</code> property in pixels plus the width of any
+  scrollbar in pixels rendered between the top padding box and top border
+  box.</p>
 
-  -->
+  <p>The <dfn><code>clientLeft</code></dfn> attribute of element <var>A</var>
+  <em class="ct">must</em> be the computed value of the
+  <code>border-left-width</code> property in pixels plus the width of any
+  scrollbar in pixels rendered between the left padding box and left border
+  box.</p>
 
-  <div class="issue">
+  <p>The <dfn><code>clientWidth</code></dfn> attribute of element <var>A</var>
+  <em class="ct">must</em> be the width of the padding box (excluding the width
+  of any rendered scrollbar between the padding and border box).</p>
 
-   <pre>So client* 0,0 area is the top left padding edge of the element.
+  <p>The <dfn><code>clientHeight</code></dfn> attribute of element <var>A</var>
+  <em class="ct">must</em> be the height of the padding box (excluding the width
+  of any rendered scrollbar between the padding and border box).</p>
 
-clientWidth for block level elments (at least) is therefore "padding-left +
-width + padding-right" (scrollbar excluded) and clientHeight
-padding-top + height + padding-bottom." (scrollbar excluded)
+  <!--
+   In strict mode clientWidth and clientHeight of the root element (HTML) is the
+   viewport (initial containing block) width and height.
 
-width and height of the "padding box"
+   In quirks mode clientWidth and clientHeight of the BODY element is the
+   viewport (initial containing block) width and height. In quirks mode
+   clientWidth and clientHeight of the root element (HTML) is viewport (initial
+   containing block) width and root element padding height.
+  -->
 
-clientTop is border-top-width. clientLeft is border-left-width. Both include the
-scrollbar width if rendered at the top or at the left. This can happen when the
-text direction is different from TB-LR.</pre>
+  <p class="issue">Need to define this for the body element and the html
+  element. For inline boxes client* is always 0...</p>
 
+  <div class="issue">
    <p>Based on limiting testing there's an object that implements TextRangle
     returned by getBoundingClientRect.</p>
 
    <p>On block level elements TextRectangleList.length is mostly 1 (except I
     guess for printing or so or multicol perhaps and for inline elements with
     multiple boxes it's the amount of boxes.</p>
-
   </div>
 
   <h2 class="no-num">Acknowledgements</h2>