0

I have such a structure:

  <label><input type="radio" name="r">1 Label</label>
  <label><input type="radio" name="r">2 Label</label>

How to change a style for label, when radio:checked ?

UPD: At using has-selector :

$( "label:has(input:checked)" ).addClass( "checklabel" );

checked element is drawn only after refresh the page.

vinegret
  • 1
  • 1
  • take a look here: http://stackoverflow.com/questions/1431726/css-selector-for-a-checked-radio-buttons-label – Akul Von Itram Jul 19 '15 at 15:12
  • There is no parent selector in CSS (yet). So, you can't apply a style to the label (the parent element) based on the input's state. Other solutions exist but require either JavaScript or rearranging the inputs. – ventaur Jul 19 '15 at 15:23
  • Yes, I saw. But I have a different structure and i need to customize only label, which is a block. Without js this is impossible? – vinegret Jul 19 '15 at 15:24

1 Answers1

-1

This should answer your problem. It's fairly straightforward.

:checked psudeo-class

cab
  • 23
  • 6
  • Thanks, but i need only for this structure. – vinegret Jul 19 '15 at 15:35
  • Code needs a little bit of tweaking. **CSS** `input[type=radio] + label { color: #ccc; font-style: italic; } input[type=radio]:checked + label { color: #f00; font-style: normal; }` **HTML** `
    – cab Jul 19 '15 at 15:51
  • Clearer, more defined questioning would have helped. – cab Jul 19 '15 at 16:30