New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.

Issue 622754 link

Starred by 3 users

Issue metadata

Status: Assigned
Owner:
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Android
Pri: 3
Type: Feature



Sign in to add a comment

Baseline position slightly too high when fitting 9px line height into 14px box

Reported by cont...@benfrain.com, Jun 23 2016

Issue description

Example URL:
http://codepen.io/benfrain/pen/OXbemZ

Steps to reproduce the problem:
1. Open URL
2. Witness the text alignment places text glyphs too high
3. 

What is the expected behavior?
text alignment should be vertically centred

What went wrong?
The text glyphs are placed too high within the containing element

Does it occur on multiple sites: Yes

Is it a problem with a plugin? No 

Did this work before? N/A 

Does this work in other browsers? Yes 

Chrome version: 46.0.2490.76  Channel: stable
OS Version: 6.0.1
Flash Version:
 
Labels: Needs-Feedback
Thanks for the report! can you upgrade chrome to latest version 51.0.2704.81 and see if the issue exists? 
Components: -Blink Blink>Layout
Hi, tried with the latest 51.0.2704.81 and the problem persists. I had wondered if it could be related to the bounding box of glyphs in different fonts (e.g. something specific to verdana). However, I have updated the link with another box which uses verdana instead and it still renders the text 'off'. Presume this is to do with half-pixels being rounded in the wrong area?
Project Member

Comment 4 by sheriffbot@chromium.org, Jun 25 2016

Labels: -Needs-Feedback Needs-Review
Owner: rsgav...@chromium.org
Thank you for providing more feedback. Adding requester "rsgavara@chromium.org" for another review and adding "Needs-Review" label for tracking.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
Components: Blink>Fonts
Owner: ----

Comment 6 by e...@chromium.org, Jun 27 2016

Labels: -Needs-Review Needs-Feedback
Our rendering (at least on linux) is identical with firefox. Could you provide a screenshot showing the behavior you consider to be correct and incorrect?

Thanks!
Here is a grab from Nexus 5: Android v5 with Chrome running 40.0.2214.89 (filename chrome_40_A510.jpeg)

Also a grab from Samsung Galaxy: Android 4.4.2 with Chrome running 51.0.2704.81 (filename chrome_51_A442.jpeg

Also a grab from iPhone 6S: iOS9 running Safari (filename safari_ios9.png)

And finally a grab from Mac running desktop Chrome Version 51.0.2704.103 (filename chrome_51_desktop.png)

To be clear, both iOS and desktop Chrome render correctly, there is an equal distribution of space at the top and bottom of the glyph. Both Android screenshots render incorrectly, with either too much space above or below the glyphs.

Remember, top glyph is system default font, second is verdana.
chrome_51_A442.jpeg
3.3 MB View Download
safari_ios9.png
41.9 KB View Download
chrome_40_A510.jpeg
2.5 MB View Download
chrome_51_desktop.png
62.3 KB View Download
Project Member

Comment 8 by sheriffbot@chromium.org, Jun 28 2016

Labels: -Needs-Feedback Needs-Review
Owner: e...@chromium.org
Thank you for providing more feedback. Adding requester "eae@chromium.org" for another review and adding "Needs-Review" label for tracking.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot

Comment 9 by e...@chromium.org, Jul 6 2016

Components: -Blink>Layout
Labels: -Needs-Review
Owner: skyos...@chromium.org
Status: Untriaged (was: Unconfirmed)
Summary: [Android] Vertical text alignment is out using any display property (was: Vertical text alignment is out using any display property)
Over to Android team for further triage.

Comment 10 by e...@chromium.org, Jul 12 2016

Status: Assigned (was: Untriaged)
Is there any way of tracking this in Android team land?
Components: Blink>Layout
Owner: ----
Status: Untriaged (was: Assigned)
Sorry, I'm not sure how this ended up in my hands. I don't really work on fonts. Maybe someone from the layout team has a better idea?
Hi,

So is someone looking at this now? Is there any place other than here I can check progress?

Thanks, Ben
Cc: cbiesin...@chromium.org
Components: Blink>Layout>Flexbox
Status: Available (was: Untriaged)
Summary: Baseline position slightly too high when fitting 9px line height into 15px box (was: [Android] Vertical text alignment is out using any display property)
Reproducible on 53 on Android, the baseline position seems to be off by just a little, possible font metrics or flexbox issue.
Just to chime in and say it happens regardless of the display mechanism used (e.g. inline-block/flex/inline-flex) and therefore seems more likely to be related to font metrics rather than flexbox.
Summary: Baseline position slightly too high when fitting 9px line height into 14px box (was: Baseline position slightly too high when fitting 9px line height into 15px box)
Components: -Blink>Layout>Flexbox
Project Member

Comment 18 by sheriffbot@chromium.org, Oct 4 2017

Labels: Hotlist-Recharge-Cold
Status: Untriaged (was: Available)
This issue has been Available for over a year. If it's no longer important or seems unlikely to be fixed, please consider closing it out. If it is important, please re-triage the issue.

Sorry for the inconvenience if the bug really should have been left as Available. If you change it back, also remove the "Hotlist-Recharge-Cold" label.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot

Comment 19 by e...@chromium.org, Oct 6 2017

Status: Available (was: Untriaged)
Project Member

Comment 20 by sheriffbot@chromium.org, Oct 8

Status: Untriaged (was: Available)
This issue has been Available for over a year. If it's no longer important or seems unlikely to be fixed, please consider closing it out. If it is important, please re-triage the issue.

Sorry for the inconvenience if the bug really should have been left as Available.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
Cc: eaeltsin@chromium.org
Components: -Blink>Fonts
Owner: kojii@chromium.org
Status: Assigned (was: Untriaged)
+kojii
Let's try to make sure we fix this in NG.

Cc: -eaeltsin@chromium.org drott@chromium.org fantasai...@inkedblade.net e...@chromium.org
Labels: -Type-Bug -Pri-2 Pri-3 Type-Feature
This is by design unfortunately, due to the way CSS defines the baseline poitision, how each browser computes font metrics, and how fonts are built.

I'm discussing with W3C to make what you want possible. The discussion is slow but I think it started making progress recently. Thank you for your patience.

Sign in to add a comment