CODEWITHSUNDEEP

Reputation: 3

Can we write CSS for a label based on the attributes of its "for" attribute's value?

I want to write css for the labels of checkboxes based on checkbox enabled/disabled. I know the following methods, but I'm not satisfied with these.

Method1:

label[for="something"] {
   /* woohoo! */
}

I want to write a generalized css. I do not want to repeat for every checkbox like above.

Method2:

input[type="checkbox"]:enabled+label{ font-weight: bold; }

this one directly picks the sibling and is not based on "for". I want to pick the label specifically that is associated with the checkbox and leave it alone if the label is not 'for' that checkbox.

How can I apply css based on a label's "for" attribute?

Upvotes: 0

Views: 40

Answers (1)

sjm

Reputation: 5468

think your after the :checked pseudo-class rather than :enabled

input[type=checkbox]:checked + label {}

The above would select a label who was the next sibling after a checked input of type checkbox

Upvotes: 2

Related Questions