specifying position:sticky

I've been working on specification text for sticky positioning 
(previously discussed starting at [1], and currently implemented in 
WebKit) that I'd be interested in feedback on:

[1] http://lists.w3.org/Archives/Public/www-style/2012Jun/0627.html


A sticky positioned box is first laid out in the normal flow (equivalent 
to position: static). The box may be repositioned as follows, but as 
with relative positioning, any repositioning does not affect the box 
that follows.

The box's position depends on its containing block (established as for 
position:static) as well as its scrolling container, defined by the 
nearest ancestor in the same document with a computed value for 
'overflow-x' or 'overflow-y' other than 'visible', or the viewport if no 
such ancestor exists.

For any of 'top', 'bottom', 'left', and 'right' that are not 'auto', if 
the box's normal position would cause that edge of its margin box to be 
less than the specified distance within that paddingedge of its 
scrolling container, the box is repositioned to that distance from the 
edge, such that the box doesnot move while the container scrolls. The 
distance the box is repositioned is limited such that the element's 
margin box never crosses the oppositeedge of the content box of its 
containing block, with the effect thatthe element starts scrolling with 
its container again when it reaches the end of its containing block.(If 
'top', 'bottom', 'left', and 'right' are all 'auto', the effect will be 
identical to relative positioning with those values). None of these 
properties affect the width or height of the element. Percentage values 
of these properties reference the padding box of the scrolling container.

If both 'top' and 'bottom' are not 'auto' and the element's margin box 
is taller than the padding boxheight of the scrolling container minus 
the sum of 'top' and 'bottom', then only 'top' is considered and 
'bottom' is ignored. Similar logic applies for 'left' and 'right' with 
widths, except that if the 'direction' property of the containing block 
is 'ltr', 'right' is ignored, and if it is 'rtl', 'left' is ignored.

Note: Sticky positioned elements are considered 'positioned', so are 
z-ordered according to the same rules asrelatively positioned elements, 
and establish the containing block of absolutely positioned descendants. 
Sticky positioning(like relative positioning)does not affect the 
computed value of 'display' as position:absolute does (so does not force 
an inline element to be displayed as block).

Received on Friday, 12 July 2013 16:38:21 UTC