Open Bug 983369 Opened 11 years ago Updated 3 years ago

field label overlaps value because font inflation doesn't inflate the relative positioning

Categories

(Core :: Layout, defect)

ARM
Android
defect

Tracking

()

People

(Reporter: Margaret, Unassigned)

References

()

Details

(Whiteboard: [readability])

Attachments

(2 files)

Attached image 2014-03-13 21.23.43.png
Seen on this test page: http://www.deque.com/padam/demo-accessible-client-side-form-validation-with-html5.html Seen on release and Nightly, so not something new. I just tested in Chrome and it's also messed up looking there, so maybe this is INVALID and just an issue with the page, but it's not an issue on desktop.
Attached file bd.html
This isn't a placeholder. Its just relatively positioned content. Its using a lot of em units to set that position, and its being font-inflated, which causes things to be positioned wrong. I wonder if we need to recompute style rules using the inflated font values. Do you know dbaron? Other than that, not much we can do.
Flags: needinfo?(dbaron)
We don't (and can't) recompute style data based on font inflation. Really not sure what to do about this; probably worth investigating what other mobile browsers with font inflation do.
Component: General → Layout
Flags: needinfo?(dbaron)
Product: Firefox for Android → Core
Summary: HTML5 date field placeholder overlaps value → field label overlaps value because font inflation doesn't inflate the relative positioning
Whiteboard: [readability]

Is this using zoom, minimum font size, or user css?

I often encounter similar trouble using user css. I think the recommended solution is to switch to full-page zoom, but that creates its own accessibility problems.

Possible dupe of bug 912159.

Severity: normal → S3
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: