Skip to content

[css-will-change] Should will-change: transform establish a containing block for fixed background attachments? #11811

@Loirooriol

Description

@Loirooriol

https://drafts.csswg.org/css-transforms/#containing-block-for-all-descendants

any value other than none for the transform property also causes the element to establish a containing block for all descendants. Its padding box will be used to layout for all of its absolute-position descendants, fixed-position descendants, and descendant fixed background attachments.

The first 2 things are covered in https://drafts.csswg.org/css-will-change/#valdef-will-change-custom-ident

If any non-initial value of a property would cause the element to generate a containing block for absolutely positioned elements, specifying that property in will-change must cause the element to generate a containing block for absolutely positioned elements.

If any non-initial value of a property would cause the element to generate a containing block for fixed positioned elements, specifying that property in will-change must cause the element to generate a containing block for fixed positioned elements.

But what about fixed background attachments, does will-change: transform establishes a containing block for them?

<!DOCTYPE html>
<style>
article {
  display: inline-block;
  height: 100px;
  overflow: hidden;
}
div {
  width: 100px;
  height: 192px;
  background: linear-gradient(to top, red, red) repeat-x fixed 0% 0% / 100px 100px green;
}
</style>
<article><div></div></article>
<article><div style="transform: scale(1)"></div></article>
<article><div style="contain: layout"></div></article>
<article><div style="will-change: transform"></div></article>
<article><div style="will-change: contain"></div></article>
<script>
for (let el of document.querySelectorAll("article")) {
  el.scrollTop = el.scrollHeight;
}
</script>
  • Gecko, Blink: yes
    Image
  • WebKit: no

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    Status

    Regular agenda

    Status

    Friday Morning

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions