Bug 254315

Summary: flex item with aspect-ratio and width has wrong height in column-flexed container with padding
Product: WebKit Reporter: alvinleung1996+webkitbugzilla
Component: Layout and RenderingAssignee: Nobody <webkit-unassigned>
Status: NEW ---    
Severity: Normal CC: bfulgham, sabouhallawa, simon.fraser, webkit-bug-importer, zalan
Priority: P2 Keywords: InRadar
Version: Safari 16   
Hardware: Mac (Intel)   
OS: macOS 12   
Attachments:
Description Flags
Bug reproduction none

Description alvinleung1996+webkitbugzilla 2023-03-22 22:18:50 PDT
Created attachment 465548 [details]
Bug reproduction

Overview:

A flex item with aspect-ratio: 1/1 and width: 100% has wrong layout height when it is inside a flex container with flex-direction: column and padding: 32px.

Steps to Reproduce:

1. Open the attached html file in Safari.

Actual Results:

The height of the blue div equals to its width plus (32px * 2).

Expected Results:

The height of the blue div equals to its width.

Build Date & Hardware:

- Safari Technology Preview, Release 165 (Safari 16.4, WebKit 17616.1.4.4)
- Safari, Version 16.3 (17614.4.6.11.6, 17614)
- on macOS, Version 12.6.3 (21G419)
Comment 1 Radar WebKit Bug Importer 2023-03-23 10:43:04 PDT
<rdar://problem/107142362>