Skip to main content
CSS is fun and cool and I like it.
Article

Radio Buttons Are Like Selects; Checkboxes Are Like Multiple Selects

I was reading Anna Kaley’s “Listboxes vs. Dropdown Lists” post the other day. It’s a fairly straightforward comparison between different UI implementations of selecting options. There is lots of good advice there. Classics like that you should use radio buttons (single select) or checkboxes (multiple select) if you’re showing five or fewer options, and the different options when the number of options grows from there. … Read article “Radio Buttons Are Like Selects; Checkboxes Are Like Multiple Selects”

Article

Custom Styling Form Inputs With Modern CSS Features

It’s entirely possible to build custom checkboxes, radio buttons, and toggle switches these days, while staying semantic and accessible. We don’t even need a single line of JavaScript or extra HTML elements! It’s actually gotten easier lately than it has been in the past. Let’s take a look.… Read article “Custom Styling Form Inputs With Modern CSS Features”

Article

A11Y with Lindsey

Lindsey Kopacz has a wonderful blog about accessibility. I’ve seen a number of her articles making the rounds lately and I was like, dang I better make sure I’m subscribed. For example:

Regarding that last one, I remember learning from Sara Soueidan that a good tip for this to position them over the new custom checkboxes and hide them via opacity … Read article “A11Y with Lindsey”

Link

Under-Engineered Toggles

Article

POSTing an Indeterminate Checkbox Value

There is a such thing as an indeterminate checkbox value. It’s a checkbox (<input type="checkbox"/>) that isn’t checked. Nor is it not checked. It’s indeterminate.

We can even select a checkbox in that state and style it with CSS!

Some curious points though:

  1. It’s only possible to set via JavaScript. There is no HTML attribute or value for it.
  2. It doesn’t POST (or GET or whatever else) or have a value. It’s like being unchecked.
Read article “POSTing an Indeterminate Checkbox Value”
Link

Radios and Checkboxes on GOV.UK

Article

Indeterminate Checkboxes

While checkboxes can only either submit their value (checked state) or not (unchecked state), they have a third visual-only state: indeterminate. This is only settable via JavaScript and does not affect the value, only the appearance. We'll cover how it works and a simple use case.