CSS :optional
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
represents :not([required])
, but :optional
is limited to just form fields.
![fetch API]()
One of the worst kept secrets about AJAX on the web is that the underlying API for it, XMLHttpRequest
, wasn't really made for what we've been using it for. We've done well to create elegant APIs around XHR but we know we can do better. Our effort to...
![Responsive and Infinitely Scalable JS Animations]()
Back in late 2012 it was not easy to find open source projects using requestAnimationFrame()
- this is the hook that allows Javascript code to synchronize with a web browser's native paint loop. Animations using this method can run at 60 fps and deliver fantastic...
![Create a NoScript Compatible Select Form Element with an onChange Event]()
I wouldn't say that I'm addicted to checking Google Analytics but I do check my statistics often. I guess hoping for a huge burst of traffic from some unknown source. Anyway, I have multiple sites set up within my account. The way to...
![Duplicate the jQuery Homepage Tooltips Using MooTools]()
The jQuery homepage has a pretty suave tooltip-like effect as seen below:
Here's how to accomplish this same effect using MooTools.
The XHTML
The above XHTML was taken directly from the jQuery homepage -- no changes.
The CSS
The above CSS has been slightly modified to match the CSS rules already...
It’s probably more like
:not(:required)
, right?