[Webkit-unassigned] [Bug 256178] New: Container query length units use border box instead of a content box

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Mon May 1 13:52:14 PDT 2023


https://bugs.webkit.org/show_bug.cgi?id=256178

            Bug ID: 256178
           Summary: Container query length units use border box instead of
                    a content box
           Product: WebKit
           Version: Safari 16
          Hardware: Unspecified
                OS: Unspecified
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: CSS
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: kizmarh at ya.ru

Created attachment 466160

  --> https://bugs.webkit.org/attachment.cgi?id=466160&action=review

HTML with the bug reproduced, saved from CodePen

Per specs, container query length units should be evaluated relative to the query container's **content box**, while currently they're evaluated relative to the border box.

Link to reproduce: https://codepen.io/kizu/pen/ExdwZaB — the square in it should be of a lime color, as with the content box of the container have 0x0 dimensions, but in Safari the units get evaluated related to the border box, so we can see the red square (the HTML from this example is also attached to this report as a file)

This example works correctly in Chrome and Firefox.

Spec quote from https://www.w3.org/TR/css-contain-3/#container-query-length

> For each element, container query length units are evaluated as container size queries on the relevant axis (or axes) described by the unit.

Spec quotes from https://www.w3.org/TR/css-contain-3/#container-size-query

> The width container feature queries the width of the query container’s content box.
> The height container feature queries the height of the query container’s content box.
> The inline-size container feature queries the size of the query container’s content box in the query container’s inline axis.
> The block-size container feature queries the size of the query container’s content box in the query container’s block axis.

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20230501/af545b9b/attachment.htm>


More information about the webkit-unassigned mailing list