A decade ago HTML and CSS added the ability to, at least signal, validation of form fields. The
required attribute helped inform users which fields were required, while
pattern allowed developers to provide a regular expression to match against an
<input>‘s value. Targeting required fields and validation values with just CSS and HTML was very useful.
Did you know that CSS provides
:optional to allow you to style form elements that aren’t required?
input:optional, select:optional, textarea:optional border: 1px solid #eee; [required] border: 1px solid red;
In a sense, it feels like
:optional is limited to just form fields.
Sooner or later you’ll run across a regular expression. With their cryptic syntax, confusing documentation and massive learning curve, most developers settle for copying and pasting them from StackOverflow and hoping they work. But what if you could decode regular expressions and harness their power? In…