1597680 - Browser differences for vertical alignment of text -- who is right?

Status: UNCONFIRMED

(Core :: Layout: Block and Inline, defect, P3)

Description

[madigens]

Attachment: Screenshot_1.png

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:70.0) Gecko/20100101 Firefox/70.0

Steps to reproduce:

1. Download and open https://gist.github.com/madig/62b1792ee775ff2b5217344ee4543d0d in Firefox and Chrome
2. See the attached screenshot of differences in vertical text alignment (Windows 10 1903, left: FF 70.0.1 with gfx.font_rendering.cleartype_params.rendering_mode=5, right: Edge Chromium 79.0.309.25). Boxes with a red border are different between FF and Edge Chromium (same in Chrome).

Actual results:

Edge Chromium seems to center text in the divs. Firefox seems to offset text downwards by one pixel by default. Except for Arial?

Expected results:

Vertical positioning of text should be the same across browsers.

Not sure which browser is right?

Comment 1

[Boris Chiou [:boris]]

Attachment: browsers-text-vertical-centering.html

Comment 2

[Boris Chiou [:boris]]

The alignment is pretty tinny but still noticeable (only some pixel difference). I suspect the spec doesn't mention this. Might be related to the implementation detail of the gfx.

Comment 3

[Emilio Cobos Álvarez (:emilio)]

I think this is mostly about whether line-height: normal influences the line boxes or not. IIRC line-height: normal makes text height influence the linebox. See also bug 1600224.

Jonathan probably has much more context than me here.