Bug 247862
| Summary: | Rendering bug when using position:fixed with containing block | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | webkit |
| Component: | Layout and Rendering | Assignee: | Nobody <webkit-unassigned> |
| Status: | RESOLVED INVALID | ||
| Severity: | Normal | CC: | bfulgham, simon.fraser, webkit, zalan |
| Priority: | P2 | ||
| Version: | WebKit Nightly Build | ||
| Hardware: | Unspecified | ||
| OS: | Unspecified | ||
webkit
For an example, see: https://game-point.net/misc/stickyMaskOverScroll/index4.htm
When a div is created with 'position:fixed' inside a container div with 'transform:translate(0); overflow:auto; max-height:300px;', and it is then given a sibling div whose content causes the container to overflow, the 'fixed' div should not change its position when the overflowing content is scrolled, in the same way that it doesn't if the fixed positioning containing block is the viewport. However, when 'transform:translate(0)' is applied to the container to establish it as the fixed positioning containing block, the 'fixed' div starts to incorrectly become scrolled along with the overflowing content as if its positioning were set to 'absolute'.
Relevant part of the CSS spec: https://w3c.github.io/csswg-drafts/css-position/#fixed-cb
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Simon Fraser (smfr)
All browsers show similar behavior here, which I think is correct; if a position:fixed element has an ancestor with a transform,then the position:fixed should behave like position:absolute.
webkit
Agreed.