CODEWITHSUNDEEP
htmlcss
JalilKarimov
JalilKarimov

Reputation: 31

css :checked - change id's background color

Here are selectors:

<label for="choise1" id="l1"></label>
<label for="choise2" id="l2"></label>
<input type="radio" id="choise1" name="navinp" checked="true" />
<input type="radio" id="choise2" name="navinp" />

and css:

#choise1:checked ~#l1 
{  background-color: #fff;  }

#choise2:checked ~#l2 
{  background-color: #fff;  }

I supposed this should change lables bgcolor but nothing happens when clicking over labels. What's wrong?

Upvotes: 2

Views: 862

Answers (2)

Kevin Bowersox
Kevin Bowersox

Reputation: 94479

This may be a browser issue since the Psuedo class selector :checked is not supported by Internet Explorer.

Reference: http://reference.sitepoint.com/css/pseudoclass-checked

Upvotes: 0

Zoltan Toth
Zoltan Toth

Reputation: 47667

The ~ selector doesn't work for the elements preceding the current one.

If you want to highlight the labels then they must come after the checkboxes - DEMO

Upvotes: 4

Related Questions