Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
Form elements do not scale well if only font size increased
See original GitHub issueIf you zoom text only in Firefox, select elements retain their 40px height but the text within them becomes larger and therefore cropped from the bottom edge.
Doesn’t seem to be as much of a problem for text inputs.
Can’t reproduce the problem in Chrome because the zoom text only option isn’t available.
Noticed this during user testing on a phone of GOV.UK’s search, specifically where we have select elements in finders.
(can’t remember what kind but possibly an iPhone 7?)
Side note: doing this on the Design System site causes the currently active menu item to be crossed out instead of underlined:
Issue Analytics
- State:
- Created 4 years ago
- Comments:11 (11 by maintainers)
Top Results From Across the Web
Top Related Medium Post
Top Related StackOverflow Question
Troubleshoot Live Code
Top Related Reddit Thread
Top Related Hackernoon Post
Top Related Tweet
Top Related Dev.to Post
Top Related Hashnode Post
It looks like this can affect text inputs, but only at extreme values (I had to modify the values for
toolkit.zoomManager.zoomValuesandzoom.maxPercentin Firefox’sabout:configto do this):We’d probably also want to scale text inputs and buttons at the same time to ensure that they remain aligned – so I’m going to rename this to ‘form inputs do not scale well…’.
The main issue with ‘em’ and ‘rem’ when using it with the legacy GOV.UK Template is that GOV.UK Template messes with the root font size, which is likely what you’re seeing.