Bug 254315 - flex item with aspect-ratio and width has wrong height in column-flexed container with padding
Summary: flex item with aspect-ratio and width has wrong height in column-flexed conta...
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Layout and Rendering (show other bugs)
Version: Safari 16
Hardware: Mac (Intel) macOS 12
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2023-03-22 22:18 PDT by alvinleung1996+webkitbugzilla
Modified: 2023-03-23 10:43 PDT (History)
5 users (show)

See Also:

Attachments
Bug reproduction (388 bytes, text/html)
2023-03-22 22:18 PDT, alvinleung1996+webkitbugzilla 		no flags Details
View All Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
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>