The Lodge is members-only design/dev videos and Office Hours.

Next Office Hours Session: "Implementing an SVG Icon System" Nov 30 - 6:00 PM Eastern

Customizing Radio Buttons and Checkboxes

  • # April 28, 2009 at 2:40 pm

    Probably a silly question, but can you customize radio buttons and checkboxes using ONLY CSS? My search resulted in a bunch of jQuery and mootools results, but I want a pure CSS solution if possible.

    # April 28, 2009 at 6:10 pm

    If you mean like literally changing the border of the little box on the checkbox, or using a custom checkmark graphic instead of the browser default, or some fine-grained customization like that. Nope, not possible. There are some pretty cool possibilities with JavaScript though, as you are finding. Basically they end up hiding the inputs entirely and replacing them with customized one.

    Next week I plan to do tutorials that will be covering this.

    # April 28, 2009 at 7:38 pm

    Yea, figured as much. I’ll look for those tuts.

    # April 29, 2009 at 6:55 am

    Thanks, Chris.

    Someone passed on this article that shows what happens in multiple browsers if you try to style form elements with only CSS. Sums it up pretty well.

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed