[Webkit-unassigned] [Bug 266965] New: Elements wrap incorrectly when inside a grid which is inside a multiple columns layout (plus result in a paint bug)

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Mon Jan 1 04:22:08 PST 2024


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

            Bug ID: 266965
           Summary: Elements wrap incorrectly when inside a grid which is
                    inside a multiple columns layout (plus result in a
                    paint bug)
           Product: WebKit
           Version: Safari Technology Preview
          Hardware: Unspecified
                OS: Unspecified
            Status: NEW
          Severity: Major
          Priority: P2
         Component: CSS
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: kizmarh at ya.ru

Created attachment 469252

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

Saved CodePen html

I was testing the way CSS grids behave when inside a multicol context, and while there is currently no interop with other browsers (Chrome and Firefox handle things slightly differently; Chrome being arguably the best, but not ideal), Safari, right now, has the biggest issues.

Here is a minimal test case: https://codepen.io/kizu/pen/dyrYvgR (I am also attaching the .html of this page to the bug)

In Safari, there are two issues:

1. Sometimes when elements wrap, they _do not wrap fully_, with lines being split in parts similar how an image could be split when going from one column's fragment into another.

2. With very specific conditions (in my case — grid having a `gap`, and paragraphs inside _not_ having a margin), resizing the container results in repaint bugs.

Marking initially as major severity due to the repaint bug; though the wrapping behavior can also be considered as such, preventing this use case (grids inside multicol) from being production-ready, and I did not find any workaround (neither any `page-break-inside` or things like making the inner elements `inline-block` help).

-- 
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/20240101/61332dce/attachment.htm>


More information about the webkit-unassigned mailing list