Bug 248777

Summary: Baseline alignment with inline <table> is broken when margin-top is applied
Product: WebKit Reporter: Ahmad Saleem <ahmad.saleem792>
Component: Layout and RenderingAssignee: Nobody <webkit-unassigned>
Status: NEW ---    
Severity: Normal CC: bfulgham, karlcow, simon.fraser, webkit-bug-importer, zalan
Priority: P2 Keywords: BrowserCompat, InRadar
Version: Safari Technology Preview   
Hardware: Unspecified   
OS: Unspecified   
Attachments:
Description Flags
rendering in safari, firefox, chrome
none
rendering in safari, firefox, chrome none

Description Ahmad Saleem 2022-12-05 13:31:45 PST 
Hi Team,

While going through Blink's commit, I came across another one below:

Blink Commit - https://src.chromium.org/viewvc/blink?view=revision&revision=165514

But rather than merging it, I just want to highlight that all browsers (Safari 16.1, Chrome Canary 110 and Firefox Nightly 109) differ from each other in this.

Differ in Each Browser - https://jsfiddle.net/p76ko893/show

Just wanted to raise this bug so it can be tracked.

Thanks!
Comment 1 Karl Dubost 2022-12-05 19:14:31 PST 
Created attachment 463905 [details]
rendering in safari, firefox, chrome

Chrome and Safari currently behave the same.
Firefox behaves differently for the rotated text.
Comment 2 Karl Dubost 2022-12-05 19:17:20 PST 
oopsie, indeed 3 different in the window is tall enough. :)
Comment 3 Radar WebKit Bug Importer 2022-12-12 13:32:18 PST 
<rdar://problem/103267754>
Comment 4 Karl Dubost 2023-01-09 18:07:53 PST 
Created attachment 464436 [details]
rendering in safari, firefox, chrome
Comment 5 Karl Dubost 2023-01-09 18:10:22 PST 
Tested on macOS 13.3
---
Safari Technology Preview  16.4          18615.1.14.3
Firefox Nightly            110.0a1       11023.1.5
Google Chrome Canary       111.0.5529.0  5529.0


I get a pretty similar rendering in Chrome and Safari compared to Firefox.
Not sure which one is the most correct.