CODEWITHSUNDEEP
cssinputlabel
Marcio Lino
Marcio Lino

Reputation: 391

Change label text color when checkbox is checked

I'm trying to change the label's text color when user check a checkbox but isn't working. I have seen some examples but none of them work with my code below:

<label class="subCatRegVars"><input type="checkbox" name="subCatRegVars" value="vlr_adc_brt_serv"> VAB </label>

CSS:
.subCatRegVars + input[type=checkbox]:checked {
      font-weight: bold;
      color: red;
}

Any help would be great!

Cheers

Upvotes: 0

Views: 1118

Answers (1)

Alvin
Alvin

Reputation: 484

You can add span to wrap text.

input[type=checkbox]:checked + span {
  font-weight: bold;
  color: red;
}
<label class="subCatRegVars">
  <input type="checkbox" name="subCatRegVars" value="vlr_adc_brt_serv">
  <span>VAB</span>
</label>

Upvotes: 1

Related Questions