RESOLVED FIXED312477
Flexbox: calc(infinity) flex-grow factor fails to stretch item to 100% width. 
https://bugs.webkit.org/show_bug.cgi?id=312477
Summary Flexbox: calc(infinity) flex-grow factor fails to stretch item to 100% width.
Nilesh Prajapati
Reported 2026-04-16 08:54:17 PDT
Hi Webkit, Issue: When resizing the window to a smaller viewport, the following demo fails to fill the remaining space in Safari. To illustrate the problem, I recommend adding a red background to the main window. https://codepen.io/amit_sheen/pen/dPpjEOv/6896f83a17a23d0f92099c3d7ad40b83?editors=1100 Ref: https://frontendmasters.com/blog/building-a-ui-without-breakpoints/ The issue is not present in either Chrome or Firefox and works as expected. It fills the remaining space at a smaller viewport size. Thanks, Nilesh
Attachments
Add attachment proposed patch, testcase, etc.
Alexey Proskuryakov
Comment 1 2026-04-16 12:02:04 PDT
*** Bug 312476 has been marked as a duplicate of this bug. ***
Nilesh Prajapati
Comment 2 2026-04-16 12:53:47 PDT
*To illustrate the problem, I recommend adding a red background to the main element.
Radar WebKit Bug Importer
Comment 3 2026-04-23 08:55:13 PDT
<rdar://problem/175431146>
Sammy Gill
Comment 4 2026-04-23 12:16:08 PDT
Pull request: https://github.com/WebKit/WebKit/pull/63453
EWS
Comment 5 2026-04-24 09:35:42 PDT
Committed 311956@main (32309d175884): <https://commits.webkit.org/311956@main> Reviewed commits have been landed. Closing PR #63453 and removing active labels.
Sammy Gill
Comment 6 2026-04-29 10:02:07 PDT
Submitted web-platform-tests pull request: https://github.com/web-platform-tests/wpt/pull/59547
Note You need to log in before you can comment on or make changes to this bug.