[Webkit-unassigned] [Bug 260499] New: mpr.makedeb.org - nested flex with height 100% inside a display: grid is very tall

[bugzilla-daemon at webkit.org]

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

            Bug ID: 260499
           Summary: mpr.makedeb.org - nested flex with height 100% inside
                    a display: grid is very tall
           Product: WebKit
           Version: Safari 17
          Hardware: Unspecified
               URL: https://mpr.makedeb.org/
                OS: Unspecified
            Status: NEW
          Keywords: BrowserCompat
          Severity: Normal
          Priority: P2
         Component: Layout and Rendering
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: karlcow at apple.com
                CC: bfulgham at webkit.org, sgill26 at apple.com,
                    simon.fraser at apple.com,
                    webkit-bug-importer at group.apple.com, zalan at apple.com

This was initially reported on https://github.com/webcompat/web-bugs/issues/124825

Steps to reproduce:
1. With STP 177 on macOS
2. Go to https://mpr.makedeb.org/

Expected:
logo and navbar at the top

Actual:
logo and navbar are overlapping content in the middle of the page.

I need to reduce to make a test case.

A quick solution for the site to fix it is to remove the "height: 100%"

```
/* style.css | https://mpr.makedeb.org/static/css/style.css */

header .makedeb-brand {
  /* height: 100%; */
}
```

But still there is a difference of behavior here for Safari compared to Chrome and Firefox.

-- 
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/20230822/262e4118/attachment.htm>