[Webkit-unassigned] [Bug 258189] New: Images with aspect ratio in a grid container makes grid cell overflow and render wrong

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Fri Jun 16 00:08:13 PDT 2023


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

            Bug ID: 258189
           Summary: Images with aspect ratio in a grid container makes
                    grid cell overflow and render wrong
           Product: WebKit
           Version: Safari 16
          Hardware: All
                OS: macOS 13
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: Layout and Rendering
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: rob at studio1902.nl
                CC: bfulgham at webkit.org, simon.fraser at apple.com,
                    zalan at apple.com

When using images with aspect ratio in a css grid container you get very weird rendering results.

Example:
https://play.tailwindcss.com/6SY8yyS9PI

Workarounds I found:
* Use `align-items: flex-start` on the grid container, but this is not always desirable.
* Put the aspect ratio on the actual img tag and not on the figure: https://play.tailwindcss.com/N7Ygj92sJg

-- 
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/20230616/53fc28f7/attachment-0001.htm>


More information about the webkit-unassigned mailing list