TIL about Constraint Validation API (forms)
POSTED ON:
Form inputs are interesting. There's a lot of mechanisms working really hard behind the scenes.
Inputs are pretty powerful. Right out of the box, they can autocomplete, validate data, create minimum/maximum lengths, allow for patterns, and even provide state!
Modern browsers have the ability to check that these constraints are being observed by users, and can warn them when those rules have been breached. This is known as the Constraint Validation API
Right out of the box - this works:
input::placeholder { color: blue; }
input:invalid { color: red; }
input:valid { color: green; }
input:enabled { color: black; }
Via The Complete Guide to HTML Forms and Constraint Validation
Related TILs
Tagged: forms