Bug 286237

Summary: Different results on Chrome and Safari for absolutely positioned elements in relation to container-type:inline-size
Product: WebKit Reporter: keir.watson
Component: Layout and RenderingAssignee: Nobody <webkit-unassigned>
Status: RESOLVED DUPLICATE    
Severity: Major CC: ahmad.saleem792, bfulgham, simon.fraser, zalan
Priority: P2    
Version: WebKit Nightly Build   
Hardware: Mac (Intel)   
OS: macOS 15   
Attachments:
Description Flags
WebKit ToT (Reference)
none
Screen shot of bug on iOS 18.2.1 none

keir.watson
Reported 2025-01-19 08:13:06 PST
I have found an issue with using position:absolute, where Safari positions relative to an enclosing div with "container-type: inline-size" instead of the grandparent div with "position:relative" Chrome positions correctly (meaning, as I expected — I don't know what the spec says) in relation to the grandparent, ignoring the div with inline-size. I have made a simple CodePen demo here which can be checked on both browsers to see the difference in output: https://codepen.io/Everybodyknows/pen/gbYjEoY
Attachments
WebKit ToT (Reference) (527.23 KB, image/png)
2025-01-19 15:40 PST, Ahmad Saleem 		no flags
Details
Screen shot of bug on iOS 18.2.1 (808.13 KB, image/jpeg)
2025-01-20 01:13 PST, keir.watson 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Ahmad Saleem
Comment 1 2025-01-19 15:40:34 PST
Created attachment 473949 [details] WebKit ToT (Reference) It seems to work fine on WebKit ToT (289139@main) and match Chrome Canary 134.
keir.watson
Comment 2 2025-01-20 01:13:48 PST
Created attachment 473952 [details] Screen shot of bug on iOS 18.2.1 It is also displayed incorrectly on mobile Safari iOS 18.2.1
zalan
Comment 3 2025-01-20 17:06:07 PST
This is a relatively recent change in spec (see https://github.com/w3c/csswg-drafts/issues/10544) and WebKit adopted this new behavior at 284730@main
zalan
Comment 4 2025-01-20 17:06:25 PST
*** This bug has been marked as a duplicate of bug 277122 ***
Note You need to log in before you can comment on or make changes to this bug.