Cristian Fogel [:cfogel] Reporter
	Description • 6 years ago

[Affected versions]:
- Firefox: 63.0.1, 64.0b7, 65.0a1 (2018-11-05)

[Affected platforms]:
- Ubuntu 16.04

[Steps to reproduce]:
1. Launch Firefox;
2. Access twitter and log in with a valid account;
3. Access the following link https://twitter.com/settings/email_notifications
4. Click on any other section from the account settings;

[Expected result]:
- content is properly displayed;

[Actual result]:
- checkboxes are a few pixels bellow their respective list lines;
- not centered as rendered on other browsers(Chrome/Edge);

[Regression range]:
- not a regression;
- checking on versions on sooner than the year 2015 displays the mobile version;

[Additional notes]:
- attached screenshot with the issue;
- on Windows and macOS the checkboxes are properly aligned.

	Daniel Holbert [:dholbert]
	Comment 1 • 6 years ago

This just comes from the fact that they're specifying a hardcoded pixel-valued "line-height" on the <label> that contains the checkbox and its label-text, and their hardcoded line-height isn't large enough to allow the text to nicely align with our (kinda-big) checkboxes on Linux.  (Note: the fact that they're big is an OS-level decision, too, I'm pretty sure -- we defer to the system theme on default widget behavior. So I don't think our checkbox sizes are a Firefox decision here -- they're an Ubuntu/Gnome decision.)


More details:
If you right-click the label in Firefox and choose "Inspect", and make sure the <label> element is focused in the DOM view, you can see that it's got a specified style of:
   line-height: 18px;
If you increase that to, say, 22px or 23px, then it aligns nicely.  And if you start with a browser where it looks nice at the default size (say, Firefox on Windows, or Chrome), and you *reduce* the hardcoded line-height to be approximately the checkbox height (13px in Chrome), then you get similar breakage there.

So, this is just Twitter making unsubstantiated assumptions about how big widgets will be, basically.

--> Reclassifying as Tech Evangelism, since it's not a Firefox bug.