@@ -152,12 +152,17 @@ Scrollable overflow</h3>
152152 all line boxes directly contained by the box
153153 <li>
154154 the border boxes
155- of all boxes for which it is the containing block
156- (accounting for transforms as described below).
155+ of all boxes for which it is the containing block,
156+ accounting for transforms by projecting each box onto
157+ the plane of the element that establishes its <a>3d-rendering context</a> .
158+ [[!CSS-TRANSFORMS-1]]
159+
160+ Issue: Is this description of handling transforms
161+ sufficiently accurate?
157162
158163 <li>
159164 the <a>scrollable overflow regions</a> of all of the above boxes
160- (accounting for transforms as described below ),
165+ (accounting for transforms as described above ),
161166 provided they themselves have ''overflow: visible''
162167 (i.e. do not themselves trap the overflow)
163168 and that overflow is not already clipped
@@ -189,67 +194,6 @@ Scrollable overflow</h3>
189194 http://software.hixie.ch/utilities/js/live-dom-viewer/?%3C!DOCTYPE%20html%3E%0A%3Cstyle%3E%0A%20%20div%20%7B%20height%3A%2050px%3B%20overflow%3A%20scroll%3B%20border%3A%20solid%3B%20position%3A%20relative%3B%7D%0A%20%20p%20%7B%20margin%3A%2025px%3B%20background%3A%20red%3B%20%7D%0A%20%20q%20%7B%20position%3A%20absolute%3B%20background%3A%20blue%3B%20top%3A%2025px%3B%20margin%3A%2025px%3B%20%7D%0A%3C%2Fstyle%3E%0A%3Cdiv%3E%0A%20%20%3Cp%3ETest%20%3Cq%3ETest2%0A%3C%2Fdiv%3E
190195 -->
191196
192- <p class="issue">
193- The following definition should be rewritten to use
194- the concept of <a href="https://drafts.csswg.org/css-transforms/#3d-rendering-context">3D rendering context</a> [[!CSS3-TRANSFORMS]]
195- and related terms,
196- particularly once those concepts stabilize following changes
197- proposed in the CSS WG meeting on the morning of 2014-01-28.
198-
199- Given the following definitions
200- <span class="issue"> which belong in [[CSS3-TRANSFORMS]] </span> :
201-
202- <dl>
203- <dt> <dfn>3d-preserving child</dfn>
204- <dd>
205- A child box <var> B</var> of a containing block <var> C</var>
206- is a 3d-preserving child
207- if it has ''transform-style: preserve-3d''
208- and the user-agent is not required to flatten it
209- based on the <a href="https://www.w3.org/TR/css3-transforms/#transform-style-property">requirements</a> in [[!CSS3-TRANSFORMS]] .
210-
211- <dt> <dfn>non-3d-preserving child</dfn>
212- <dd>
213- A child <var> C</var> of a box <var> P</var> is a non-3d-preserving-child
214- if it is not a <a>3d-preserving child</a> .
215-
216- <dt> <dfn>3d-preserving descendant</dfn>
217- <dd>
218- Box <var> D</var> is a 3d-preserving descendant of box <var> A</var>
219- if <var> A</var> is an ancestor of D,
220- and <var> D</var> and all of the boxes (if any)
221- in the <a>containing block chain</a> from <var> D</var> to <var> A</var>
222- are <a>3d-preserving child</a> boxes.
223- </dl>
224-
225- The <a>scrollable overflow</a> of a box is the union of the following things,
226- all adjusted for transforms <span class="issue"> undefined concept!</span> into the box's coordinate space:
227-
228- <ul>
229- <li>
230- for the box and all of its <a>3d-preserving descendant</a> boxes:
231- <ul>
232- <li> the box's own padding edge (for the box itself) or border edge (for <a>3d-preserving descendant</a> boxes)</li>
233- <li> the bounds <span class="issue"> undefined term!</span> of any text directly in the box</li>
234- <li><span class="issue"> MORE HERE!</span>
235- </ul>
236- <li>
237- for all the <a>non-3d-preserving child</a> boxes of the
238- box and its <a>3d-preserving descendant</a> boxes,
239- the scrollable overflow of the box
240- </li>
241- </ul>
242-
243- <p class="issue">
244- I wrote this definition off the top of my head,
245- so it can't possibly be right.
246- It's missing tons of pieces!
247-
248- <p class="issue">
249- The handling of preserve-3d subtrees here is probably wrong;
250- the elements should probably count
251- only towards the overflow of the element that flattens them.
252-
253197 Note that the <a>scrollable overflow rectangle</a> is a always rectangle
254198 in the box's own coordinate system, but might be non-rectangular
255199 in other coordinate systems due to transforms [[CSS3-TRANSFORMS]] .
0 commit comments