Base font size is at least 16px
Why it matters
iOS Safari auto-zooms the entire page whenever a form input with a font-size below 16px receives focus. That zoom disrupts the layout, forces users to manually zoom back out, and abandons the tap position — effectively breaking the form submission flow on iPhone for a significant share of mobile users. WCAG 2.2 SC 1.4.4 (Resize Text) requires text to be resizable without loss of content or functionality; a base font below 16px often means inputs are already too small to use comfortably before any zoom occurs. Smaller base fonts also reduce legibility on high-DPI screens where antialiasing assumptions change below the 16px threshold.
Severity rationale
Medium because the failure degrades the form experience on iOS Safari specifically, causing involuntary page zoom rather than full inaccessibility.
Remediation
Set a 16px floor in your global stylesheet and on all form controls. In src/app/globals.css (or your equivalent base stylesheet):
html { font-size: 16px; }
input, select, textarea { font-size: 16px; }
In Tailwind, text-base maps to 1rem (16px). Never apply text-xs or text-sm directly to <input> or <select> elements — wrap a label styled small instead.
DetectionPro
The detection method for this pattern is part of AuditBuffet Pro.
The full method (what to look for, pass and fail conditions, and how results get reported) ships inside the Mobile Responsiveness Audit. The pattern definition, severity rationale, and remediation remain openly licensed under CC-BY-4.0.
External references
- wcag:2.2 · 1.4.4 — Resize Text
Taxons
History
- 2026-04-18·v1.0.0·Initial import from mobile-responsiveness·automated