Re: Sticky Positioning

It may help to reduce the vertical screen resolution in the developer tools
panel as it seems to be sensitive to that.  But it sounds like you are
visualizing it properly anyway.

> This means that every <h1> in the document will "stick" 10 pixels from
> the viewport top when things scroll such that the <h1> would have been
> partially off-screen. When the viewport has scrolled such that the
> visible portion of the <h1>'s containing box is too small to fit the
> <h1>, it should stop at the containing box's edge and only be partially
> displayed.

Is it correct to say that this is equivalent to specifying "position:
fixed; position-contain: parent" in the alternate proposal?  I.e. the <h1>
is always fixed at 10px from the top of the viewport, unless that would
bring it outside the bounds of its containing box, in which case its
position is clamped to the containing box's edge.  In that case, I agree it
addresses the google.com map example.



On Thu, Jun 28, 2012 at 2:25 PM, Maciej Stachowiak <mjs@apple.com> wrote:

>
> On Jun 28, 2012, at 1:52 PM, Alexandre Elias <aelias@chromium.org> wrote:
>
> Sorry about that, looks like the behavior is currently restricted to
> Android.
>
> You can simulate an Android browser in desktop Chrome (I tested the
> following using version 20 beta) by doing the following:
> - Visit http://google.com/
> - Click "Developer tools", then the small gear at the bottom right of the
> panel.
> - Click "Override User Agent" and select "Android 2.3 - Nexus S" (not
> Galaxy Nexus as the high resolution somehow breaks the behavior I'm
> describing in this desktop simulation mode -- though it does happen on a
> real Galaxy Nexus)
> - Reload the page to see the mobile version, then click "Restaurants" as
> before.
>
> You should see the map is sticky, then appears to reach a limit and
> gradually falls out of view if you scroll down to the bottom of the page.
>
>
> With these steps, I'm not able to replicate the behavior you describe. I
> see the map sticking, but not disappearing close to the bottom. I do see it
> tracking its container until it hits the top. What I see can definitely be
> replicated with position: sticky as proposed. I think the more complex
> behavior you describe can also be replicated with position: sticky, but I'm
> hesitant to say definitively without seeing the behavior first.
> Specifically, I think that if you make the sticky element's containing
> block stop short of the bottom of the page, you will get the described
> behavior. Again, I'm not 100% sure as I can't see it for myself yet.
>
> Cheers,
> Maciej
>
>