Bug 260461

Summary:

Out of flow element with `display: grid` and `height: fit-content` takes up whole viewport when a child is present

Product:

WebKit

Reporter:

Karl Dubost <karlcow>

Component:

Layout and Rendering

Assignee:

Nobody <webkit-unassigned>

Status:

NEW

Severity:

Normal

CC:

akeerthi, aristidesfl, bfulgham, cdumez, ntim, sgill26, simon.fraser, webkit-bug-importer, wenson_hsieh, zalan

Priority:

Keywords:

BrowserCompat, InRadar

Version:

Safari 17

Hardware:

Unspecified

OS:

Unspecified

Attachments:

Description	Flags
testcase	none
rendering in Safari, firefox, chrome	none
reduced testcase	none

Karl Dubost

Reported 2023-08-20 23:14:43 PDT

Created attachment 467359 [details] testcase Steps to reproduce: 1. Open the testcase in Safari, Firefox and Chrome Expected: A dialog with a button having a reasonable size. Actual: On safari, the button is taking the full height of the viewport.

Attachments
testcase (405 bytes, text/html) 2023-08-20 23:14 PDT, Karl Dubost	no flags	Details
rendering in Safari, firefox, chrome (412.07 KB, image/png) 2023-08-20 23:16 PDT, Karl Dubost	no flags	Details
reduced testcase (174 bytes, text/html) 2023-08-21 09:39 PDT, Tim Nguyen (:ntim)	no flags	Details
View All Add attachment proposed patch, testcase, etc.

Radar WebKit Bug Importer

Comment 1 2023-08-20 23:14:53 PDT

<rdar://problem/114177004>

Karl Dubost

Comment 2 2023-08-20 23:16:51 PDT

Created attachment 467360 [details] rendering in Safari, firefox, chrome This was initially reported on https://github.com/webcompat/web-bugs/issues/125362 Tested on macOS 14.0 --- Safari Technology Preview 176 19617.1.1.2 Firefox Nightly 118.0a1 11823.8.19 Google Chrome Canary 118.0.5960.0 5960.0

Tim Nguyen (:ntim)

Comment 3 2023-08-21 09:39:52 PDT

Created attachment 467370 [details] reduced testcase

Sammy Gill

Comment 4 2024-12-10 17:25:48 PST

I think our logic for the height: fit-content is wrong. The grid should be sized as min(max-content, max(min-content, stretch)) according to https://drafts.csswg.org/css-grid-2/#intrinsic-sizes We seem to think we have a definite logical height: bool hasDefiniteLogicalHeight = RenderBlock::hasDefiniteLogicalHeight() || overridingLogicalHeight() || computeContentLogicalHeight(RenderBox::SizeType::MainOrPreferredSize, style().logicalHeight(), std::nullopt) || shouldComputeLogicalHeightFromAspectRatio(); and just use that as part of track sizing as the definite available space. We probably need to compute and take into consideration the min/max content sizes of the grid https://drafts.csswg.org/css-grid-2/#intrinsic-sizes

aristidesfl

Comment 5 2026-02-18 04:41:40 PST

Came here to report the same. Subscribed.

Note You need to log in before you can comment on or make changes to this bug.