Skip to content

[css-position][css-sticky] Scrolling ancestor should probably include overflow:hidden even when content doesn't overflow #3083

Closed
@stephenmcgruer

Description

@stephenmcgruer

The spec[1] states that "the offset is computed with reference to the nearest ancestor with a scrolling box, or the viewport if no ancestor has a scrolling box." where a scrolling box is created if "Elements and viewports have an associated scrolling box if has a scrolling mechanism or it overflows its content area and the used value of the overflow-x or overflow-y property is hidden." [2]

This is not the behavior implemented by any web-browser. Scrolling the viewport on http://output.jsbin.com/yaxovep in any of Chrome, Firefox, or Safari shows that the sticky element is sticking to the overflow:hidden ancestor for both scrollers, even in the left-hand case where the content area isn't overflowed.

Rather than change all three browsers to follow the spec (which would also be an awkward change imo since you would end up jumping sticky ancestors when layout changes), we should change the spec I think.

@flackr

[1] https://www.w3.org/TR/css-position-3/#sticky-pos

[2] https://drafts.csswg.org/cssom-view/#terminology

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions