Your sites Log in Sign up Menu

Styling disabled checkbox inputs

One more of these and then I'll stop trying to turn this Questions section into my own personal CSS school... for at least a few weeks.

Is it possible to style checkboxes? Specifically I have a page using some checked and unchecked items; they're not intended to be editable by visitors, that's fine, but I think the 'disabled' selector is messing me up.

Here's the page (I'm trying to just make the 'checked' boxes stand out a bit more by giving them a coloured background. Here's what I've tried to no avail:

input[type="checkbox"]:disabled {
  background: #46adf9;
}

3 years ago, 2 replies   Improve this question

It is possible to but I think it involves a bit of a hack. The technique to style checkboxes, even disabled ones, is described nicely by John Reid over on Stack Overflow. It's a bit of a hack but should get you what you're after.

Please let me know if you have any questions about this or anything else

Answered 3 years ago · Improve this answer

Wow, who knew this particular customisation would be so specifically problematic? Thanks very much for providing a solution.

Answered 3 years ago · Improve this answer