[Webkit-unassigned] [Bug 282326] New: Grid breaks when using auto-fit if the element is also a container

[bugzilla-daemon at webkit.org]

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

            Bug ID: 282326
           Summary: Grid breaks when using auto-fit if the element is also
                    a container
           Product: WebKit
           Version: Safari 18
          Hardware: Unspecified
                OS: macOS 15
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: CSS
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: kevin at kevinpowell.co
                CC: koivisto at iki.fi

Created attachment 473077

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

Image with grid inspector on, showing the issue with grid-auto-fit, and comparing it to auto-fill

When an element uses Grid's auto-fit and also has a `container-type: size` or `container-type: inline-size`, it breaks the grid.
The columns become 0px in width, and it also creates an incorrect number of columns.

The following should create columns with a minimum width of 100px, but instead, it creates columns that are 0px in width.

.grid-auto-fit {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));

  container-type: inline-size;
}

As for the number of columns, it matches how many would be created if using `auto-fill` instead. For example, if `auto-fill` would create 10 columns, `auto-fill` also results in 10 columns (though now 0px in width), even if there are only three children.

Both Chromium browsers and Firefox behave as expected, this issue is only in Safari.

I've attached an image of the issue, and a live example of the issue can be found here: https://codepen.io/kevinpowell/pen/yLmjyYp

-- 
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/20241030/40c19fcf/attachment-0001.htm>