user2197029 user2197029 - 9 months ago 56
CSS Question

Target two siblings of input:checked

I'm trying to style two siblings -- a span and a div -- of input:checked like this...

input:checked + span {styles}

input:checked + div {styles}

Not working... What am I missing?

Answer Source

Your DOM structure is the problem. <span> and <div> are probably not sibling to inputs because css is fine. Here is example of how sibling of inputs work:

<input type="radio" name="group1" checked/>
<input type="radio" name="group1" />

And css:

input:checked + span {color:red;}

input:checked + div {color:red;}

And here is JSFiddle: