[csswg-drafts] [css3-positioning] position:sticky algorithm currently prefers bottom over top, and right over left

stephenmcgruer has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css3-positioning] position:sticky algorithm currently prefers bottom over top, and right over left ==
Spec section: https://www.w3.org/TR/css-position-3/#sticky-pos

Currently Chrome, Firefox, and (I believe) Safari implement position: sticky such that when 'top' and 'bottom' conflict, the 'top' value wins (e.g. the element will be pushed down rather than up in such a case). 

However this behavior is not backed (as far as I can tell) by the algorithm in the spec. The algorithm instructs the UA to first move the sticky down for the 'top' value (step 3), and then move the sticky up for the 'bottom' value (step 4). This would actually mean that 'bottom' overrides 'top' (and 'right' overrides 'left' similarly).

I suspect that this is behavior that is meant to be covered by Issue 2 (at time of writing): "Say what happens if this rectangle is empty". The 'rectangle' here is the inset rectangle created from the flow box rectangle (e.g. created from the scroller), and I believe the issue should instead read 'Say what happens if this rectangle is smaller than the position: sticky element'. The latter is precisely the case where we will have conflict between some properties, and need to specify which one wins.

So imo we should both correct the issue text, and then actually fix the issue by specifying which property wins :)

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/1294 using your GitHub account

Received on Tuesday, 25 April 2017 15:42:54 UTC