CODEWITHSUNDEEP
jquerycss
theinlwin
theinlwin

Reputation: 171

how use checkBox is Checked change textcolor

I wanted Inputype is Checked . Text Color is RED.

 <div class="checkbox"><label><input type="checkbox"> Sedan <span>(10)</span></label></div>
 <div class="checkbox"><label><input type="checkbox"> Sedan <span>(10)</span></label></div>

DEMO

Upvotes: 1

Views: 4391

Answers (3)

hahaha
hahaha

Reputation: 1037

Here is a working fiddle.

What I did: fixed your css selector and html label tags.

changed html to

<div class="checkbox">
    <input type="checkbox">
    <label> Sedan <span>(10)</span></label>
</div>
<div class="checkbox">
    <input type="checkbox">
    <label> Sedan <span>(10)</span></label>
</div>
<div class="checkbox">
    <input type="checkbox">
    <label> Sedan <span>(10)</span></label>
</div>
<div class="checkbox">
    <input type="checkbox">
    <label> Sedan <span>(10)</span></label>
</div>

and css to

input[type=checkbox]:checked + label{
    color:red;
}
input[type=checkbox]:checked + span{
    color:red;
}

Upvotes: 0

user3820621
user3820621

Reputation: 337

Try use the below code

But this will work from IE9 + browser

<div class="checkbox">
<input type="checkbox"> 
<label>Sedan <span>(10)</span></label>
</div>

and in css

input[type=checkbox]:checked + label {
color: #f00;
font-style: normal;
}

Upvotes: 1

Umesh Sehta
Umesh Sehta

Reputation: 10659

Change your html like this :-

<div class="checkbox"><input type="checkbox"/> <label>Sedan <span>(10)</span></label></div>

and then in css:-

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

Demo

Upvotes: 2

Related Questions