[cssom-view] Make 'scrolling area' make sense for viewports and use it instead of 'document content'

Tue, 04 Jun 2013 10:22:45 +0200

author
Simon Pieters <simonp@opera.com>
date
Tue, 04 Jun 2013 10:22:45 +0200
changeset 8340
676259865cac
parent 8339
cf25179f94ef
child 8341
97a1f1b066aa

[cssom-view] Make 'scrolling area' make sense for viewports and use it instead of 'document content'

cssom-view/Overview.html file | annotate | diff | comparison | revisions
cssom-view/Overview.src.html file | annotate | diff | comparison | revisions
     1.1 --- a/cssom-view/Overview.html	Tue Jun 04 01:01:47 2013 +0200
     1.2 +++ b/cssom-view/Overview.html	Tue Jun 04 10:22:45 2013 +0200
     1.3 @@ -20,6 +20,9 @@
     1.4     span:not(.secno) { border-bottom:solid red }
     1.5     .atrisk::before { position:absolute; left:30px; margin-top:-8px; width:25px; height:25px; padding:0 4px 8px; border:1px solid; content:'At risk'; 
     1.6     font-size:smaller; background:white; color:gray; border-radius:25px; text-align:center }
     1.7 +   td { vertical-align:baseline }
     1.8 +   td, th { border:solid }
     1.9 +   table { border:hidden; border-collapse:collapse }
    1.10    </style>
    1.11    <link href="https://www.w3.org/StyleSheets/TR/W3C-ED" rel="stylesheet">
    1.12   </head>
    1.13 @@ -32,7 +35,7 @@
    1.14  
    1.15   <h1>CSSOM View Module</h1>
    1.16  
    1.17 - <h2 class="no-num no-toc" id="w3c-doctype">Editor's Draft 3 June 2013</h2>
    1.18 + <h2 class="no-num no-toc" id="w3c-doctype">Editor's Draft 4 June 2013</h2>
    1.19  
    1.20   <dl>
    1.21  
    1.22 @@ -91,7 +94,7 @@
    1.23  can be found in the <a href="http://www.w3.org/TR/">W3C technical reports
    1.24  index at http://www.w3.org/TR/.</a></em>
    1.25  
    1.26 -<p>This is the 3 June 2013 Editor's Draft of CSSOM View. Please send
    1.27 +<p>This is the 4 June 2013 Editor's Draft of CSSOM View. Please send
    1.28  comments to
    1.29  <a href="mailto:www-style@w3.org?subject=%5Bcssom-view%5D%20">www-style@w3.org</a>
    1.30  (<a href="http://lists.w3.org/Archives/Public/www-style/">archived</a>)
    1.31 @@ -269,68 +272,124 @@
    1.32  <p>The term <dfn id="scrolling-area">scrolling area</dfn> refers to a box of a <a href="#viewport">viewport</a> or an element that has the following edges, depending on the
    1.33  <a href="#viewport">viewport</a>'s or element's scrolling box's <a href="#overflow-directions">overflow directions</a>.
    1.34  
    1.35 -<dl class="switch">
    1.36 - <dt>If the <a href="#overflow-directions">overflow directions</a> are rightward and downward
    1.37 - <dd>
    1.38 -  <dl>
    1.39 -   <dt>top edge
    1.40 -   <dd><p>The element's top <a href="#padding-edge">padding edge</a>.
    1.41 -   <dt>right edge
    1.42 -   <dd><p>The right-most edge of the element's right <a href="#padding-edge">padding edge</a> and the right <a href="#margin-edge">margin edge</a> of the element's all descendant boxes,
    1.43 -   excluding boxes that have an ancestor of element as their containing block.
    1.44 -   <dt>bottom edge
    1.45 -   <dd><p>The bottom-most edge of the element's bottom <a href="#padding-edge">padding edge</a> and the bottom <a href="#margin-edge">margin edge</a> of the element's all descendant boxes,
    1.46 -   excluding boxes that have an ancestor of element as their containing block.
    1.47 -   <dt>left edge
    1.48 -   <dd><p>The element's left <a href="#padding-edge">padding edge</a>.
    1.49 -  </dl>
    1.50 - <dt>If the <a href="#overflow-directions">overflow directions</a> are leftward and downward
    1.51 - <dd>
    1.52 -  <dl>
    1.53 -   <dt>top edge
    1.54 -   <dd><p>The element's top <a href="#padding-edge">padding edge</a>.
    1.55 -   <dt>right edge
    1.56 -   <dd><p>The element's right <a href="#padding-edge">padding edge</a>.
    1.57 -   <dt>bottom edge
    1.58 -   <dd><p>The bottom-most edge of the element's bottom <a href="#padding-edge">padding edge</a> and the bottom <a href="#margin-edge">margin edge</a> of the element's all descendant boxes,
    1.59 -   excluding boxes that have an ancestor of element as their containing block.
    1.60 -   <dt>left edge
    1.61 -   <dd><p>The left-most edge of the element's left <a href="#padding-edge">padding edge</a> and the left <a href="#margin-edge">margin edge</a> of the element's all descendant boxes,
    1.62 -   excluding boxes that have an ancestor of element as their containing block.
    1.63 -  </dl>
    1.64 - <dt>If the <a href="#overflow-directions">overflow directions</a> are leftward and upward
    1.65 - <dd>
    1.66 -  <dl>
    1.67 -   <dt>top edge
    1.68 -   <dd><p>The top-most edge of the element's top <a href="#padding-edge">padding edge</a> and the top <a href="#margin-edge">margin edge</a> of the element's all descendant boxes,
    1.69 -   excluding boxes that have an ancestor of element as their containing block.
    1.70 -   <dt>right edge
    1.71 -   <dd><p>The element's right <a href="#padding-edge">padding edge</a>.
    1.72 -   <dt>bottom edge
    1.73 -   <dd><p>The element's bottom <a href="#padding-edge">padding edge</a>.
    1.74 -   <dt>left edge
    1.75 -   <dd><p>The left-most edge of the element's left <a href="#padding-edge">padding edge</a> and the left <a href="#margin-edge">margin edge</a> of the element's all descendant boxes,
    1.76 -   excluding boxes that have an ancestor of element as their containing block.
    1.77 -  </dl>
    1.78 - <dt>If the <a href="#overflow-directions">overflow directions</a> are rightward and upward
    1.79 - <dd>
    1.80 -  <dl>
    1.81 -   <dt>top edge
    1.82 -   <dd><p>The top-most edge of the element's top <a href="#padding-edge">padding edge</a> and the top <a href="#margin-edge">margin edge</a> of the element's all descendant boxes,
    1.83 -   excluding boxes that have an ancestor of element as their containing block.
    1.84 -   <dt>right edge
    1.85 -   <dd><p>The right-most edge of the element's right <a href="#padding-edge">padding edge</a> and the right <a href="#margin-edge">margin edge</a> of the element's all descendant boxes,
    1.86 -   excluding boxes that have an ancestor of element as their containing block.
    1.87 -   <dt>bottom edge
    1.88 -   <dd><p>The element's bottom <a href="#padding-edge">padding edge</a>.
    1.89 -   <dt>left edge
    1.90 -   <dd><p>The element's left <a href="#padding-edge">padding edge</a>.
    1.91 -  </dl>
    1.92 -</dl>
    1.93 -
    1.94 -<p>The term <dfn id="document-content">document content</dfn> refers to the area on the
    1.95 -<a href="#canvas">canvas</a> that is rendered upon, excluding content on negative
    1.96 -axis.</p>
    1.97 +<table>
    1.98 + <tr>
    1.99 +  <th>If the <a href="#overflow-directions">overflow directions</a> areā€¦
   1.100 +  <th>For a <a href="#viewport">viewport</a>
   1.101 +  <th>For an element
   1.102 + <tr>
   1.103 +  <td>rightward and downward
   1.104 +  <td>
   1.105 +   <dl>
   1.106 +    <dt>top edge
   1.107 +    <dd><p>The top edge of the <a href="#initial-containing-block">initial containing block</a>.
   1.108 +    <dt>right edge
   1.109 +    <dd><p>The right-most edge of the right edge of the <a href="#initial-containing-block">initial containing block</a> and the right <a href="#margin-edge">margin edge</a> of the
   1.110 +    <a href="#viewport">viewport</a>'s all descendant boxes.
   1.111 +    <dt>bottom edge
   1.112 +    <dd><p>The bottom-most edge of the bottom edge of the <a href="#initial-containing-block">initial containing block</a> and the bottom <a href="#margin-edge">margin edge</a> of the
   1.113 +    <a href="#viewport">viewport</a>'s all descendant boxes.
   1.114 +    <dt>left edge
   1.115 +    <dd><p>The left edge of the <a href="#initial-containing-block">initial containing block</a>.
   1.116 +   </dl>
   1.117 +  <td>
   1.118 +   <dl>
   1.119 +    <dt>top edge
   1.120 +    <dd><p>The element's top <a href="#padding-edge">padding edge</a>.
   1.121 +    <dt>right edge
   1.122 +    <dd><p>The right-most edge of the element's right <a href="#padding-edge">padding edge</a> and the right <a href="#margin-edge">margin edge</a> of the element's all descendant boxes,
   1.123 +    excluding boxes that have an ancestor of element as their containing block.
   1.124 +    <dt>bottom edge
   1.125 +    <dd><p>The bottom-most edge of the element's bottom <a href="#padding-edge">padding edge</a> and the bottom <a href="#margin-edge">margin edge</a> of the element's all descendant boxes,
   1.126 +    excluding boxes that have an ancestor of element as their containing block.
   1.127 +    <dt>left edge
   1.128 +    <dd><p>The element's left <a href="#padding-edge">padding edge</a>.
   1.129 +   </dl>
   1.130 + <tr>
   1.131 +  <td>leftward and downward
   1.132 +  <td>
   1.133 +   <dl>
   1.134 +    <dt>top edge
   1.135 +    <dd><p>The top edge of the <a href="#initial-containing-block">initial containing block</a>.
   1.136 +    <dt>right edge
   1.137 +    <dd><p>The right edge of the <a href="#initial-containing-block">initial containing block</a>.
   1.138 +    <dt>bottom edge
   1.139 +    <dd><p>The bottom-most edge of the bottom edge of the <a href="#initial-containing-block">initial containing block</a> and the bottom <a href="#margin-edge">margin edge</a> of the
   1.140 +    <a href="#viewport">viewport</a>'s all descendant boxes.
   1.141 +    <dt>left edge
   1.142 +    <dd><p>The left-most edge of the left edge of the <a href="#initial-containing-block">initial containing block</a> and the left <a href="#margin-edge">margin edge</a> of the
   1.143 +    <a href="#viewport">viewport</a>'s all descendant boxes.
   1.144 +   </dl>
   1.145 +  <td>
   1.146 +   <dl>
   1.147 +    <dt>top edge
   1.148 +    <dd><p>The element's top <a href="#padding-edge">padding edge</a>.
   1.149 +    <dt>right edge
   1.150 +    <dd><p>The element's right <a href="#padding-edge">padding edge</a>.
   1.151 +    <dt>bottom edge
   1.152 +    <dd><p>The bottom-most edge of the element's bottom <a href="#padding-edge">padding edge</a> and the bottom <a href="#margin-edge">margin edge</a> of the element's all descendant boxes,
   1.153 +    excluding boxes that have an ancestor of element as their containing block.
   1.154 +    <dt>left edge
   1.155 +    <dd><p>The left-most edge of the element's left <a href="#padding-edge">padding edge</a> and the left <a href="#margin-edge">margin edge</a> of the element's all descendant boxes,
   1.156 +    excluding boxes that have an ancestor of element as their containing block.
   1.157 +   </dl>
   1.158 + <tr>
   1.159 +  <td>leftward and upward
   1.160 +  <td>
   1.161 +   <dl>
   1.162 +    <dt>top edge
   1.163 +    <dd><p>The top-most edge of the top edge of the <a href="#initial-containing-block">initial containing block</a> and the top <a href="#margin-edge">margin edge</a> of the
   1.164 +    <a href="#viewport">viewport</a>'s all descendant boxes.
   1.165 +    <dt>right edge
   1.166 +    <dd><p>The right edge of the <a href="#initial-containing-block">initial containing block</a>.
   1.167 +    <dt>bottom edge
   1.168 +    <dd><p>The bottom edge of the <a href="#initial-containing-block">initial containing block</a>.
   1.169 +    <dt>left edge
   1.170 +    <dd><p>The left-most edge of the left edge of the <a href="#initial-containing-block">initial containing block</a> and the left <a href="#margin-edge">margin edge</a> of the
   1.171 +    <a href="#viewport">viewport</a>'s all descendant boxes.
   1.172 +   </dl>
   1.173 +  <td>
   1.174 +   <dl>
   1.175 +    <dt>top edge
   1.176 +    <dd><p>The top-most edge of the element's top <a href="#padding-edge">padding edge</a> and the top <a href="#margin-edge">margin edge</a> of the element's all descendant boxes,
   1.177 +    excluding boxes that have an ancestor of element as their containing block.
   1.178 +    <dt>right edge
   1.179 +    <dd><p>The element's right <a href="#padding-edge">padding edge</a>.
   1.180 +    <dt>bottom edge
   1.181 +    <dd><p>The element's bottom <a href="#padding-edge">padding edge</a>.
   1.182 +    <dt>left edge
   1.183 +    <dd><p>The left-most edge of the element's left <a href="#padding-edge">padding edge</a> and the left <a href="#margin-edge">margin edge</a> of the element's all descendant boxes,
   1.184 +    excluding boxes that have an ancestor of element as their containing block.
   1.185 +   </dl>
   1.186 + <tr>
   1.187 +  <td>rightward and upward
   1.188 +  <td>
   1.189 +   <dl>
   1.190 +    <dt>top edge
   1.191 +    <dd><p>The top-most edge of the top edge of the <a href="#initial-containing-block">initial containing block</a> and the top <a href="#margin-edge">margin edge</a> of the
   1.192 +    <a href="#viewport">viewport</a>'s all descendant boxes.
   1.193 +    <dt>right edge
   1.194 +    <dd><p>The right-most edge of the right edge of the <a href="#initial-containing-block">initial containing block</a> and the right <a href="#margin-edge">margin edge</a> of the
   1.195 +    <a href="#viewport">viewport</a>'s all descendant boxes.
   1.196 +    <dt>bottom edge
   1.197 +    <dd><p>The bottom edge of the <a href="#initial-containing-block">initial containing block</a>.
   1.198 +    <dt>left edge
   1.199 +    <dd><p>The left edge of the <a href="#initial-containing-block">initial containing block</a>.
   1.200 +   </dl>
   1.201 +  <td>
   1.202 +   <dl>
   1.203 +    <dt>top edge
   1.204 +    <dd><p>The top-most edge of the element's top <a href="#padding-edge">padding edge</a> and the top <a href="#margin-edge">margin edge</a> of the element's all descendant boxes,
   1.205 +    excluding boxes that have an ancestor of element as their containing block.
   1.206 +    <dt>right edge
   1.207 +    <dd><p>The right-most edge of the element's right <a href="#padding-edge">padding edge</a> and the right <a href="#margin-edge">margin edge</a> of the element's all descendant boxes,
   1.208 +    excluding boxes that have an ancestor of element as their containing block.
   1.209 +    <dt>bottom edge
   1.210 +    <dd><p>The element's bottom <a href="#padding-edge">padding edge</a>.
   1.211 +    <dt>left edge
   1.212 +    <dd><p>The element's left <a href="#padding-edge">padding edge</a>.
   1.213 +   </dl>
   1.214 +</table>
   1.215  
   1.216  <p>The term <dfn id="css-layout-box">CSS layout box</dfn> refers to the same term in CSS. For the purpose
   1.217  of the requirements in this specification, elements that have a computed value of the
   1.218 @@ -501,11 +560,11 @@
   1.219   </li>
   1.220   <!-- XXX support upward overflow -->
   1.221   <li><p>Let <var title="">y</var> be max(0, min(<var title="">y</var>,
   1.222 - <a href="#document-content">document content</a> height - <a href="#viewport">viewport</a>
   1.223 + <a href="#viewport">viewport</a> <a href="#scrolling-area">scrolling area</a> height - <a href="#viewport">viewport</a>
   1.224   height excluding the size of a rendered scroll bar (if any))).</li>
   1.225   <li><p>Let <var title="">position</var> be the scroll position the <a href="#viewport">viewport</a> would have by aligning the x-coordinate <var title="">x</var> of the
   1.226 - <a href="#document-content">document content</a> with the left of the <a href="#viewport">viewport</a> and aligning the y-coordinate <var title="">y</var> of the <a href="#document-content">document content</a>
   1.227 - with the top of the <a href="#viewport">viewport</a>.
   1.228 + <a href="#viewport">viewport</a> <a href="#scrolling-area">scrolling area</a> with the left of the <a href="#viewport">viewport</a> and aligning the y-coordinate <var title="">y</var> of the
   1.229 + <a href="#viewport">viewport</a> <a href="#scrolling-area">scrolling area</a> with the top of the <a href="#viewport">viewport</a>.
   1.230   <li><p>If <var title="">position</var> is the same as the <a href="#viewport">viewport</a>'s current scroll position, and the <a href="#viewport">viewport</a> does not have an ongoing
   1.231   <a href="#concept-smooth-scroll" title="concept-smooth-scroll">smooth scroll</a>, abort these steps.
   1.232   <li><p>Let <var title="">task</var> be these steps:
   1.233 @@ -883,11 +942,11 @@
   1.234   <li><p>If the element is the root element and the
   1.235   <code class="external"><a href="http://dom.spec.whatwg.org/#document">Document</a></code> is not in
   1.236   <a class="external" href="http://dom.spec.whatwg.org/#concept-document-quirks" title="concept-document-quirks">quirks mode</a>
   1.237 - return max(<a href="#document-content">document content</a> width, <var title="">viewport width</var>).</li>
   1.238 + return max(<a href="#viewport">viewport</a> <a href="#scrolling-area">scrolling area</a> width, <var title="">viewport width</var>).</li>
   1.239   <li><p>If the element is <a href="#the-html-body-element">the HTML <code>body</code> element</a>
   1.240   and the <code class="external"><a href="http://dom.spec.whatwg.org/#document">Document</a></code> is in
   1.241   <a class="external" href="http://dom.spec.whatwg.org/#concept-document-quirks" title="concept-document-quirks">quirks mode</a>
   1.242 - return max(<a href="#document-content">document content</a> width, <var title="">viewport width</var>).</li>
   1.243 + return max(<a href="#viewport">viewport</a> <a href="#scrolling-area">scrolling area</a> width, <var title="">viewport width</var>).</li>
   1.244   <li><p>Return the width of the element's <a href="#scrolling-area">scrolling area</a>.</li>
   1.245  </ol>
   1.246  
   1.247 @@ -900,11 +959,11 @@
   1.248   <li><p>If the element is the root element and the
   1.249   <code class="external"><a href="http://dom.spec.whatwg.org/#document">Document</a></code> is not in
   1.250   <a class="external" href="http://dom.spec.whatwg.org/#concept-document-quirks" title="concept-document-quirks">quirks mode</a>
   1.251 - return max(<a href="#document-content">document content</a> height, <var title="">viewport height</var>).</li>
   1.252 + return max(<a href="#viewport">viewport</a> <a href="#scrolling-area">scrolling area</a> height, <var title="">viewport height</var>).</li>
   1.253   <li><p>If the element is <a href="#the-html-body-element">the HTML <code>body</code> element</a>
   1.254   and the <code class="external"><a href="http://dom.spec.whatwg.org/#document">Document</a></code> is in
   1.255   <a class="external" href="http://dom.spec.whatwg.org/#concept-document-quirks" title="concept-document-quirks">quirks mode</a>
   1.256 - return max(<a href="#document-content">document content</a> height, <var title="">viewport height</var>).</li>
   1.257 + return max(<a href="#viewport">viewport</a> <a href="#scrolling-area">scrolling area</a> height, <var title="">viewport height</var>).</li>
   1.258   <li><p>Return the height of the element's <a href="#scrolling-area">scrolling area</a>.</li>
   1.259  </ol>
   1.260  
     2.1 --- a/cssom-view/Overview.src.html	Tue Jun 04 01:01:47 2013 +0200
     2.2 +++ b/cssom-view/Overview.src.html	Tue Jun 04 10:22:45 2013 +0200
     2.3 @@ -22,6 +22,9 @@
     2.4     span:not(.secno) { border-bottom:solid red }
     2.5     .atrisk::before { position:absolute; left:30px; margin-top:-8px; width:25px; height:25px; padding:0 4px 8px; border:1px solid; content:'At risk'; 
     2.6     font-size:smaller; background:white; color:gray; border-radius:25px; text-align:center }
     2.7 +   td { vertical-align:baseline }
     2.8 +   td, th { border:solid }
     2.9 +   table { border:hidden; border-collapse:collapse }
    2.10    </style>
    2.11    <link rel="stylesheet" href="https://www.w3.org/StyleSheets/TR/W3C-[STATUS]">
    2.12   </head>
    2.13 @@ -237,68 +240,124 @@
    2.14  <p>The term <dfn>scrolling area</dfn> refers to a box of a <span>viewport</span> or an element that has the following edges, depending on the
    2.15  <span>viewport</span>'s or element's scrolling box's <span>overflow directions</span>.
    2.16  
    2.17 -<dl class=switch>
    2.18 - <dt>If the <span>overflow directions</span> are rightward and downward
    2.19 - <dd>
    2.20 -  <dl>
    2.21 -   <dt>top edge
    2.22 -   <dd><p>The element's top <span>padding edge</span>.
    2.23 -   <dt>right edge
    2.24 -   <dd><p>The right-most edge of the element's right <span>padding edge</span> and the right <span>margin edge</span> of the element's all descendant boxes,
    2.25 -   excluding boxes that have an ancestor of element as their containing block.
    2.26 -   <dt>bottom edge
    2.27 -   <dd><p>The bottom-most edge of the element's bottom <span>padding edge</span> and the bottom <span>margin edge</span> of the element's all descendant boxes,
    2.28 -   excluding boxes that have an ancestor of element as their containing block.
    2.29 -   <dt>left edge
    2.30 -   <dd><p>The element's left <span>padding edge</span>.
    2.31 -  </dl>
    2.32 - <dt>If the <span>overflow directions</span> are leftward and downward
    2.33 - <dd>
    2.34 -  <dl>
    2.35 -   <dt>top edge
    2.36 -   <dd><p>The element's top <span>padding edge</span>.
    2.37 -   <dt>right edge
    2.38 -   <dd><p>The element's right <span>padding edge</span>.
    2.39 -   <dt>bottom edge
    2.40 -   <dd><p>The bottom-most edge of the element's bottom <span>padding edge</span> and the bottom <span>margin edge</span> of the element's all descendant boxes,
    2.41 -   excluding boxes that have an ancestor of element as their containing block.
    2.42 -   <dt>left edge
    2.43 -   <dd><p>The left-most edge of the element's left <span>padding edge</span> and the left <span>margin edge</span> of the element's all descendant boxes,
    2.44 -   excluding boxes that have an ancestor of element as their containing block.
    2.45 -  </dl>
    2.46 - <dt>If the <span>overflow directions</span> are leftward and upward
    2.47 - <dd>
    2.48 -  <dl>
    2.49 -   <dt>top edge
    2.50 -   <dd><p>The top-most edge of the element's top <span>padding edge</span> and the top <span>margin edge</span> of the element's all descendant boxes,
    2.51 -   excluding boxes that have an ancestor of element as their containing block.
    2.52 -   <dt>right edge
    2.53 -   <dd><p>The element's right <span>padding edge</span>.
    2.54 -   <dt>bottom edge
    2.55 -   <dd><p>The element's bottom <span>padding edge</span>.
    2.56 -   <dt>left edge
    2.57 -   <dd><p>The left-most edge of the element's left <span>padding edge</span> and the left <span>margin edge</span> of the element's all descendant boxes,
    2.58 -   excluding boxes that have an ancestor of element as their containing block.
    2.59 -  </dl>
    2.60 - <dt>If the <span>overflow directions</span> are rightward and upward
    2.61 - <dd>
    2.62 -  <dl>
    2.63 -   <dt>top edge
    2.64 -   <dd><p>The top-most edge of the element's top <span>padding edge</span> and the top <span>margin edge</span> of the element's all descendant boxes,
    2.65 -   excluding boxes that have an ancestor of element as their containing block.
    2.66 -   <dt>right edge
    2.67 -   <dd><p>The right-most edge of the element's right <span>padding edge</span> and the right <span>margin edge</span> of the element's all descendant boxes,
    2.68 -   excluding boxes that have an ancestor of element as their containing block.
    2.69 -   <dt>bottom edge
    2.70 -   <dd><p>The element's bottom <span>padding edge</span>.
    2.71 -   <dt>left edge
    2.72 -   <dd><p>The element's left <span>padding edge</span>.
    2.73 -  </dl>
    2.74 -</dl>
    2.75 -
    2.76 -<p>The term <dfn>document content</dfn> refers to the area on the
    2.77 -<span>canvas</span> that is rendered upon, excluding content on negative
    2.78 -axis.</p>
    2.79 +<table>
    2.80 + <tr>
    2.81 +  <th>If the <span>overflow directions</span> are&hellip;
    2.82 +  <th>For a <span>viewport</span>
    2.83 +  <th>For an element
    2.84 + <tr>
    2.85 +  <td>rightward and downward
    2.86 +  <td>
    2.87 +   <dl>
    2.88 +    <dt>top edge
    2.89 +    <dd><p>The top edge of the <span>initial containing block</span>.
    2.90 +    <dt>right edge
    2.91 +    <dd><p>The right-most edge of the right edge of the <span>initial containing block</span> and the right <span>margin edge</span> of the
    2.92 +    <span>viewport</span>'s all descendant boxes.
    2.93 +    <dt>bottom edge
    2.94 +    <dd><p>The bottom-most edge of the bottom edge of the <span>initial containing block</span> and the bottom <span>margin edge</span> of the
    2.95 +    <span>viewport</span>'s all descendant boxes.
    2.96 +    <dt>left edge
    2.97 +    <dd><p>The left edge of the <span>initial containing block</span>.
    2.98 +   </dl>
    2.99 +  <td>
   2.100 +   <dl>
   2.101 +    <dt>top edge
   2.102 +    <dd><p>The element's top <span>padding edge</span>.
   2.103 +    <dt>right edge
   2.104 +    <dd><p>The right-most edge of the element's right <span>padding edge</span> and the right <span>margin edge</span> of the element's all descendant boxes,
   2.105 +    excluding boxes that have an ancestor of element as their containing block.
   2.106 +    <dt>bottom edge
   2.107 +    <dd><p>The bottom-most edge of the element's bottom <span>padding edge</span> and the bottom <span>margin edge</span> of the element's all descendant boxes,
   2.108 +    excluding boxes that have an ancestor of element as their containing block.
   2.109 +    <dt>left edge
   2.110 +    <dd><p>The element's left <span>padding edge</span>.
   2.111 +   </dl>
   2.112 + <tr>
   2.113 +  <td>leftward and downward
   2.114 +  <td>
   2.115 +   <dl>
   2.116 +    <dt>top edge
   2.117 +    <dd><p>The top edge of the <span>initial containing block</span>.
   2.118 +    <dt>right edge
   2.119 +    <dd><p>The right edge of the <span>initial containing block</span>.
   2.120 +    <dt>bottom edge
   2.121 +    <dd><p>The bottom-most edge of the bottom edge of the <span>initial containing block</span> and the bottom <span>margin edge</span> of the
   2.122 +    <span>viewport</span>'s all descendant boxes.
   2.123 +    <dt>left edge
   2.124 +    <dd><p>The left-most edge of the left edge of the <span>initial containing block</span> and the left <span>margin edge</span> of the
   2.125 +    <span>viewport</span>'s all descendant boxes.
   2.126 +   </dl>
   2.127 +  <td>
   2.128 +   <dl>
   2.129 +    <dt>top edge
   2.130 +    <dd><p>The element's top <span>padding edge</span>.
   2.131 +    <dt>right edge
   2.132 +    <dd><p>The element's right <span>padding edge</span>.
   2.133 +    <dt>bottom edge
   2.134 +    <dd><p>The bottom-most edge of the element's bottom <span>padding edge</span> and the bottom <span>margin edge</span> of the element's all descendant boxes,
   2.135 +    excluding boxes that have an ancestor of element as their containing block.
   2.136 +    <dt>left edge
   2.137 +    <dd><p>The left-most edge of the element's left <span>padding edge</span> and the left <span>margin edge</span> of the element's all descendant boxes,
   2.138 +    excluding boxes that have an ancestor of element as their containing block.
   2.139 +   </dl>
   2.140 + <tr>
   2.141 +  <td>leftward and upward
   2.142 +  <td>
   2.143 +   <dl>
   2.144 +    <dt>top edge
   2.145 +    <dd><p>The top-most edge of the top edge of the <span>initial containing block</span> and the top <span>margin edge</span> of the
   2.146 +    <span>viewport</span>'s all descendant boxes.
   2.147 +    <dt>right edge
   2.148 +    <dd><p>The right edge of the <span>initial containing block</span>.
   2.149 +    <dt>bottom edge
   2.150 +    <dd><p>The bottom edge of the <span>initial containing block</span>.
   2.151 +    <dt>left edge
   2.152 +    <dd><p>The left-most edge of the left edge of the <span>initial containing block</span> and the left <span>margin edge</span> of the
   2.153 +    <span>viewport</span>'s all descendant boxes.
   2.154 +   </dl>
   2.155 +  <td>
   2.156 +   <dl>
   2.157 +    <dt>top edge
   2.158 +    <dd><p>The top-most edge of the element's top <span>padding edge</span> and the top <span>margin edge</span> of the element's all descendant boxes,
   2.159 +    excluding boxes that have an ancestor of element as their containing block.
   2.160 +    <dt>right edge
   2.161 +    <dd><p>The element's right <span>padding edge</span>.
   2.162 +    <dt>bottom edge
   2.163 +    <dd><p>The element's bottom <span>padding edge</span>.
   2.164 +    <dt>left edge
   2.165 +    <dd><p>The left-most edge of the element's left <span>padding edge</span> and the left <span>margin edge</span> of the element's all descendant boxes,
   2.166 +    excluding boxes that have an ancestor of element as their containing block.
   2.167 +   </dl>
   2.168 + <tr>
   2.169 +  <td>rightward and upward
   2.170 +  <td>
   2.171 +   <dl>
   2.172 +    <dt>top edge
   2.173 +    <dd><p>The top-most edge of the top edge of the <span>initial containing block</span> and the top <span>margin edge</span> of the
   2.174 +    <span>viewport</span>'s all descendant boxes.
   2.175 +    <dt>right edge
   2.176 +    <dd><p>The right-most edge of the right edge of the <span>initial containing block</span> and the right <span>margin edge</span> of the
   2.177 +    <span>viewport</span>'s all descendant boxes.
   2.178 +    <dt>bottom edge
   2.179 +    <dd><p>The bottom edge of the <span>initial containing block</span>.
   2.180 +    <dt>left edge
   2.181 +    <dd><p>The left edge of the <span>initial containing block</span>.
   2.182 +   </dl>
   2.183 +  <td>
   2.184 +   <dl>
   2.185 +    <dt>top edge
   2.186 +    <dd><p>The top-most edge of the element's top <span>padding edge</span> and the top <span>margin edge</span> of the element's all descendant boxes,
   2.187 +    excluding boxes that have an ancestor of element as their containing block.
   2.188 +    <dt>right edge
   2.189 +    <dd><p>The right-most edge of the element's right <span>padding edge</span> and the right <span>margin edge</span> of the element's all descendant boxes,
   2.190 +    excluding boxes that have an ancestor of element as their containing block.
   2.191 +    <dt>bottom edge
   2.192 +    <dd><p>The element's bottom <span>padding edge</span>.
   2.193 +    <dt>left edge
   2.194 +    <dd><p>The element's left <span>padding edge</span>.
   2.195 +   </dl>
   2.196 +</table>
   2.197  
   2.198  <p>The term <dfn>CSS layout box</dfn> refers to the same term in CSS. For the purpose
   2.199  of the requirements in this specification, elements that have a computed value of the
   2.200 @@ -469,11 +528,11 @@
   2.201   </li>
   2.202   <!-- XXX support upward overflow -->
   2.203   <li><p>Let <var title>y</var> be max(0, min(<var title>y</var>,
   2.204 - <span>document content</span> height - <span>viewport</span>
   2.205 + <span>viewport</span> <span>scrolling area</span> height - <span>viewport</span>
   2.206   height excluding the size of a rendered scroll bar (if any))).</p></li>
   2.207   <li><p>Let <var title>position</var> be the scroll position the <span>viewport</span> would have by aligning the x-coordinate <var title>x</var> of the
   2.208 - <span>document content</span> with the left of the <span>viewport</span> and aligning the y-coordinate <var title>y</var> of the <span>document content</span>
   2.209 - with the top of the <span>viewport</span>.
   2.210 + <span>viewport</span> <span>scrolling area</span> with the left of the <span>viewport</span> and aligning the y-coordinate <var title>y</var> of the
   2.211 + <span>viewport</span> <span>scrolling area</span> with the top of the <span>viewport</span>.
   2.212   <li><p>If <var title>position</var> is the same as the <span>viewport</span>'s current scroll position, and the <span>viewport</span> does not have an ongoing
   2.213   <span title=concept-smooth-scroll>smooth scroll</span>, abort these steps.
   2.214   <li><p>Let <var title>task</var> be these steps:
   2.215 @@ -849,11 +908,11 @@
   2.216   <li><p>If the element is the root element and the
   2.217   <code data-anolis-spec=dom>Document</code> is not in
   2.218   <span data-anolis-spec=dom title=concept-document-quirks>quirks mode</span>
   2.219 - return max(<span>document content</span> width, <var title>viewport width</var>).</p></li>
   2.220 + return max(<span>viewport</span> <span>scrolling area</span> width, <var title>viewport width</var>).</p></li>
   2.221   <li><p>If the element is <span>the HTML <code>body</code> element</span>
   2.222   and the <code data-anolis-spec=dom>Document</code> is in
   2.223   <span data-anolis-spec=dom title=concept-document-quirks>quirks mode</span>
   2.224 - return max(<span>document content</span> width, <var title>viewport width</var>).</p></li>
   2.225 + return max(<span>viewport</span> <span>scrolling area</span> width, <var title>viewport width</var>).</p></li>
   2.226   <li><p>Return the width of the element's <span>scrolling area</span>.</p></li>
   2.227  </ol>
   2.228  
   2.229 @@ -866,11 +925,11 @@
   2.230   <li><p>If the element is the root element and the
   2.231   <code data-anolis-spec=dom>Document</code> is not in
   2.232   <span data-anolis-spec=dom title=concept-document-quirks>quirks mode</span>
   2.233 - return max(<span>document content</span> height, <var title>viewport height</var>).</p></li>
   2.234 + return max(<span>viewport</span> <span>scrolling area</span> height, <var title>viewport height</var>).</p></li>
   2.235   <li><p>If the element is <span>the HTML <code>body</code> element</span>
   2.236   and the <code data-anolis-spec=dom>Document</code> is in
   2.237   <span data-anolis-spec=dom title=concept-document-quirks>quirks mode</span>
   2.238 - return max(<span>document content</span> height, <var title>viewport height</var>).</p></li>
   2.239 + return max(<span>viewport</span> <span>scrolling area</span> height, <var title>viewport height</var>).</p></li>
   2.240   <li><p>Return the height of the element's <span>scrolling area</span>.</p></li>
   2.241  </ol>
   2.242  

mercurial