Implement CSS Containment content-visibility
Categories
(Core :: Layout, enhancement)
Tracking
()
Webcompat Priority | P3 |
People
(Reporter: karlcow, Unassigned)
References
(Depends on 7 open bugs, Blocks 2 open bugs)
Details
https://drafts.csswg.org/css-contain-2/#content-visibility
The content-visibility property controls whether or not an element renders its contents at all, along with forcing a strong set of containments, allowing user agents to potentially omit large swathes of layout and rendering work until it becomes needed.
.somecontent {content-visibility: visible}
.somecontent {content-visibility: hidden}
.somecontent {content-visibility: auto}
See https://web.dev/content-visibility/
At this date, only implemented in Chromium 85
https://www.chromestatus.com/feature/4613920211861504
https://bugs.chromium.org/p/chromium/issues/detail?id=882663
no visible bug on Safari yet.
https://bugs.webkit.org/buglist.cgi?quicksearch=content-visibility
Note:
- Opening as a placeholder for this property.
- And in case we see webcompat issue in the future. (none yet)
Updated•4 years ago
|
Comment 1•4 years ago
|
||
Hi. I get bug with content-visibility:auto; for svg element in div. If img with svg more than block with property content-visibility:auto; img with svg would cropped
Comment 2•4 years ago
|
||
We don't implement this property, are you having this bug with Firefox or Chromium-based browsers? Could you attach a test-case?
Comment 3•4 years ago
|
||
Yes, I can show you.
https://drive.google.com/file/d/1OJVQZbMnoWyBN0atdprkH8BA8DMiRC0M/view?usp=sharing
http://prntscr.com/unxed2
- It's my test work =) Sorry, I don't know how else I can show you an error. You will see this error if you open file index.html.
Comment 4•4 years ago
|
||
That only happens in Chrome as expected, so this is not the correct bug tracker to report it, that's https://crbug.com. But the bug is invalid, the icon is overflowing the content-visibility: auto
element. It behaves like contain: paint
.
Updated•3 years ago
|
Reporter | ||
Updated•3 years ago
|
Updated•2 years ago
|
Updated•2 years ago
|
Updated•2 years ago
|
Updated•2 years ago
|
Updated•1 year ago
|
Description
•