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

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.