CODEWITHSUNDEEP
css
webguy
webguy

Reputation: 692

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?

Upvotes: 1

Views: 66

Answers (1)

Mariusz Szurgot
Mariusz Szurgot

Reputation: 432

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

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

And css:

input:checked + span {color:red;}

input:checked + div {color:red;}

And here is JSFiddle: https://jsfiddle.net/marszurgot/yawksjvj/

Upvotes: 1

Related Questions