Bug 249992 – [CSS Container Queries] @container query not affected when page Zoomed in our out

• Component: CSS
• Status: RESOLVED FIXED

[Roman Czerkies]

When we zoom in or zoom out on in Safari, container queries are not affected by the change of the inline-size of the viewport.

That particularly affect the user accessibility.

[Radar WebKit Bug Importer]

<rdar://problem/104022272>

[Roman Czerkies]

It can be reproduced on : https://romanczerki.es/

[Simon Fraser (smfr)]

When you say "zoomed", how are you zooming? With Command-+, or pinch-zoom?

[Roman Czerkies]

When zooming with Command-+.

The normal behavior of the @container query on the `nav` element only appear when you increase or decrease the size of the viewport.

[Antti Koivisto]

I think we fail to take 'zoom' property into account when evaluating container queries.

[Roman Czerkies]

A new wrong behavior detected about container queries:

* Set a `container` property in html element (as an Initial Containing Block)
* Zoom+- in the webpage, nothing happen 
* Reload the page to see the zoom effect

Don't know if this bug has to be fill in a new issue, but it sounds like to be involved in the same first reported (https://bugs.webkit.org/show_bug.cgi?id=249992#c0).

[Roman Czerkies]

New wrong behaviors with a `container` property set on `html` element:

* Once in a while, when you open a link in this page and clic on precedent the page is not rendering (a blank page occurs).

* When media queries are updated from the device's operating system, or the user agent (`prefers-color-scheme` or `prefers-contrast` for instance) anything is updated, you have to reload the page to update the page and custom properties.

[Roman Czerkies]

Issue resolved with this fix: https://bugs.webkit.org/show_bug.cgi?id=282592.
Thanks.