Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Text alignment issue on Windows #1469

Closed
hannalaakso opened this issue Jun 24, 2019 · 2 comments
Closed

Text alignment issue on Windows #1469

hannalaakso opened this issue Jun 24, 2019 · 2 comments
Milestone
v3.0.0

Comments

@hannalaakso
Copy link
Member

hannalaakso commented Jun 24, 2019 •
edited
Loading

Button text in IE9-11 and Edge is not correctly aligned:

Screen Shot 2019-06-24 at 14 12 09

Screen Shot 2019-06-24 at 14 12 47

Replicated on Browserstack and on Windows 10 laptop in Empathy Lab

Current buttons

The current buttons align the text correctly

Screen Shot 2019-06-24 at 14 09 44

Screen Shot 2019-06-24 at 14 10 19
@hannalaakso hannalaakso added the awaiting triage Needs triaging by team label Jun 24, 2019
@hannalaakso hannalaakso self-assigned this Jun 25, 2019
@hannalaakso
Copy link
Member Author

hannalaakso commented Jun 25, 2019 •
edited
Loading

It looks like this could be about the font's alignment on Windows in general. As well as seeing the text further up from the baseline in IE and Edge, I can also see it on Chrome on Windows:

Screen Shot 2019-06-25 at 17 25 01
Chrome 75 on Windows 10 (Browserstack and native Windows 10)

Screen Shot 2019-06-25 at 17 29 36
Chrome 75 on Windows 10 (Browserstack and native Windows 10)

If change the font to Arial, the alignment corrects itself:

Screen Shot 2019-06-25 at 17 29 36
With Arial on Chrome 75 on Windows 10 (Browserstack and native Windows 10)

Screen Shot 2019-06-25 at 17 29 36
With Arial on Edge 18 on Windows 10 (Browserstack and native Windows 10)

Potential cause

I wonder if it could be related to vertical metrics and the fact that typoLineGap was changed but not the usWin values.

@hannalaakso hannalaakso mentioned this issue Jun 25, 2019
Closed
@timpaul timpaul removed the awaiting triage Needs triaging by team label Jun 26, 2019
@hannalaakso hannalaakso changed the title Button text alignment issue in IE Text alignment issue on Windows Jun 26, 2019
@kellylee-gds kellylee-gds mentioned this issue Jul 4, 2019
Closed
34 tasks
@36degrees 36degrees added this to the v3.0.0 milestone Jul 4, 2019
@36degrees 36degrees changed the title Text alignment issue on Windows Fix text alignment issue on Windows Jul 9, 2019
@36degrees 36degrees changed the title Fix text alignment issue on Windows Text alignment issue on Windows Jul 9, 2019
@36degrees 36degrees mentioned this issue Jul 9, 2019
Closed
@hannalaakso
Copy link
Member Author

Fixed by #1486

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
v3.0.0
Development

No branches or pull requests
3 participants
@36degrees @timpaul @hannalaakso