multi radio buttons transformed into a radio button with css?

Issue

I want After click on the radio,
Radio-selected that background color is yellow putting background label, with use of css no js.
how is it?

Example of myself: http://jsfiddle.net/DVJmS/6/
Example of ui: http://jqueryui.com/demos/button/radio.html -> I not want use of plugin this is only a example.

Solution

Volia

What you need to do is:

1. wrap each <input /><label></label> in a <div>
2. give input[type="radio”] a width and height of 0px
3. Then add this rule to your css :checked ~ label { background: #f00; }

What that last one does is says if there’s a sibling of mine that is checked preceding me then make me have a background of #f00. Just change the alignment and colors to fit your site.

Also, you should never give two elements the same ID. If you want to be able to select two elements at once always uses classes.

Answered By - Aria Corbett