Bug 273759 - SVGs with absolute positioning are incorrectly sized when ancestor has padding
Summary: SVGs with absolute positioning are incorrectly sized when ancestor has padding
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Layout and Rendering (show other bugs)
Version: Safari 17
Hardware: Mac (Apple Silicon) macOS 14
: P2 Normal
Assignee: Nobody
URL:
Keywords: BrowserCompat, CanvaBug, InRadar
Depends on:
Blocks:
 
Reported: 2024-05-06 02:11 PDT by Matt Moran
Modified: 2024-05-07 17:40 PDT (History)
6 users (show)

See Also:

Attachments
Example file to reproduce bug (938 bytes, text/html)
2024-05-06 02:11 PDT, Matt Moran 		no flags Details
Screenshot of current layout in Safari (67.04 KB, image/png)
2024-05-06 02:14 PDT, Matt Moran 		no flags Details
Screenshot of current layout in Chrome (67.68 KB, image/png)
2024-05-06 02:15 PDT, Matt Moran 		no flags Details
Screenshot of current layout in Firefox (71.18 KB, image/png)
2024-05-06 02:16 PDT, Matt Moran 		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 Matt Moran 2024-05-06 02:11:39 PDT 
Created attachment 471289 [details]
Example file to reproduce bug

SVGs with absolute positioning are incorrectly sized when ancestor has padding.

There are two symptoms demonstrated in the attachment:

1. When I have an div that has `width: 200px; padding: 20px`, a child SVG with `position: absolute; left: 0; right: 0` has a width that matches the div's content width when it should match the div's padding width.

2. When I have an absolutely positioned div that has `padding: 20px` and a computed height of 200px, a child SVG with `position: absolute; height: 100%` has a height that matches the div's content height when it should match the div's padding height.

Chrome and Firefox do not have this bug.
Comment 1 Matt Moran 2024-05-06 02:14:27 PDT 
Created attachment 471290 [details]
Screenshot of current layout in Safari
Comment 2 Matt Moran 2024-05-06 02:15:51 PDT 
Created attachment 471291 [details]
Screenshot of current layout in Chrome
Comment 3 Matt Moran 2024-05-06 02:16:13 PDT 
Created attachment 471292 [details]
Screenshot of current layout in Firefox
Comment 4 Radar WebKit Bug Importer 2024-05-06 09:47:01 PDT 
<rdar://problem/127608838>