CSS :autofill
Autofilling HTML input elements is a frequent user action that can drastically improve user experience. Hell, we all autofill for our passwords and address information. But what control do we have when input elements have been autofilled?
To add custom CSS styles to inputs whose contents have been autofilled by the browser, you can use the :autofill pseudo-class:
input:autofill {
border: 2px solid orange;
}
I'm really happy that browsers allow site and app developers to customize the styling of elements that have been changed by the browser. Autofill, to a degree, is an unnatural act, so signaling to that the value in an input was changed without control is important.
Since different browsers and operating systems sometimes style autofilled elements differently, :autofill is hugely beneficial!
![An Interview with Eric Meyer]()
Your early CSS books were instrumental in pushing my love for front end technologies. What was it about CSS that you fell in love with and drove you to write about it?
At first blush, it was the simplicity of it as compared to the table-and-spacer...
![Being a Dev Dad]()
I get asked loads of questions every day but I'm always surprised that they're rarely questions about code or even tech -- many of the questions I get are more about non-dev stuff like what my office is like, what software I use, and oftentimes...
![Create a Context Menu with Dojo and Dijit]()
Context menus, used in the right type of web application, can be invaluable. They provide shortcut methods to different functionality within the application and, with just a right click, they are readily available. Dojo's Dijit frameworks provides an easy way to create stylish, flexible context...
![Modal-Style Text Selection with Fokus]()
Every once in a while I find a tiny JavaScript library that does something very specific, very well. My latest find, Fokus, is a utility that listens for text selection within the page, and when such an event occurs, shows a beautiful modal dialog in...
