You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Currently, DateField uses proportional (non-monospace) font. In proportional fonts, digits and separators can have different widths (and widths can vary across digits), so the caret and surrounding text shift as you enter or edit values. That “jumping” feels glitchy.
Screen.Recording.2026-02-10.at.11.17.46.mov
Also proportional font makes it difficult to set an input width that fits content. The CSS property field-sizing can help, but browser support is limited.
Solution Proposal
Using a monospace font keeps the input visually stable.
Screen.Recording.2026-02-10.at.11.19.09.mov
It also makes it easy to keep the input width in sync with its content using the size attribute.
Objective
Currently, DateField uses proportional (non-monospace) font. In proportional fonts, digits and separators can have different widths (and widths can vary across digits), so the caret and surrounding text shift as you enter or edit values. That “jumping” feels glitchy.
Screen.Recording.2026-02-10.at.11.17.46.mov
Also proportional font makes it difficult to set an input width that fits content. The CSS property
field-sizingcan help, but browser support is limited.Solution Proposal
Using a monospace font keeps the input visually stable.
Screen.Recording.2026-02-10.at.11.19.09.mov
It also makes it easy to keep the input width in sync with its content using the size attribute.
Native
<input type="date">uses monospace font.