Bug 244697 - `aspect-ratio` inside flex container with fixed height and border overflows container
Summary: `aspect-ratio` inside flex container with fixed height and border overflows c...
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Layout and Rendering (show other bugs)
Version: Safari 15
Hardware: All All
: P2 Normal
Assignee: Nobody
URL:
Keywords: BrowserCompat, InRadar
Depends on:
Blocks:
 
Reported: 2022-09-01 18:18 PDT by Benoît Rouleau
Modified: 2024-04-11 18:45 PDT (History)
10 users (show)

See Also:

Attachments
HTML file showcasing the issue (532 bytes, text/html)
2022-09-01 18:18 PDT, Benoît Rouleau 		no flags Details
rendering in Safari, Safari TP, firefox, chrome (189.89 KB, image/png)
2022-09-01 23:24 PDT, Karl Dubost 		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 Benoît Rouleau 2022-09-01 18:18:16 PDT 
Created attachment 462083 [details]
HTML file showcasing the issue

Compare the attached HTML file in different browsers. Safari is the only one that renders the red square over the black border.
Comment 1 Radar WebKit Bug Importer 2022-09-01 23:18:50 PDT 
<rdar://problem/99475341>
Comment 2 Karl Dubost 2022-09-01 23:24:37 PDT 
Created attachment 462087 [details]
rendering in Safari, Safari TP, firefox, chrome

Tested on macOS 13.0
---
Safari                     16.1          18614.2.1.1.1
Safari Technology Preview  16.0          18615.1.2.3
Firefox Nightly            106.0a1       10622.8.31
Google Chrome Canary       107.0.5275.0  5275.0


the div doesn't have a 1:1 ratio but a 1:2 ratio.