[Webkit-unassigned] [Bug 175029] "position:sticky" does not work correctly in flex item

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=175029

jonjohnjohnson <hi at jonjohnjohnson.com> changed:

           What    |Removed                     |Added
----------------------------------------------------------------------------
                 CC|                            |hi at jonjohnjohnson.com

--- Comment #3 from jonjohnjohnson <hi at jonjohnjohnson.com> ---
i.poluyanov at icloud.com
webkit at jmailer.xyz
jonathan.cammisuli at soti.net

As far as work arounds, all of your examples could be "fixed" by putting another element inside the scrolling element that wraps around all the contents. This effectively acts as a containing block for any sticky elements inside the "scrollport". Give it a min-height to match the scroller if you want. Otherwise use display flex on each.

This is due to sticky positioning as a feature, being quite underspecified. And though firefox/chrome, allow a scrolling elements "scrollHeight" to be used for wrapping sticky elements, safari (I think) uses the scrolling elements "clientHeight" to analyze the "sticky constraint rectangle".

Demo #2 -> http://usefulangle.com/post/40/javascript-client-height-vs-offset-height-vs-scroll-height

The spec is unclear if Safari should match other implementations, but for interop, I hope they do.

Just to reiterate, this isn't do to display flex.

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20180423/788a1591/attachment.html>