2016-03-29 18 views
0

Bir onay kutusunu bir resim kullanarak şekillendirmek istiyorum, ancak onay kutusu jiletle oluşturulduğundan, ek bir gizli giriş oluşturduğundan, onay kutusu ve etiketin yan yana oturmaması ve dolayısıyla artık komşu kardeş seçicileri olarakcss3 checkbox styling ekstra girişle çalışmaz

girişi [tipi = kutusunun] + etiket

artık çalışır.

gizli giriş ve stil çalışmalarını çıkarın ama bu daha önce Razor ile bu sorunu vardı benim için burada http://jsfiddle.net/4huzr/2434/

.yesno input[type=checkbox] + label { 
    background-image: url(http://placehold.it/40x40/ff6633/000000?text=yes); 
    height: 40px; 
    width: 40px; 
    display: inline-block; 
    padding: 0px; 
    } 

cevap

0

Fiddle bir seçenek değildir.

.yesno input[type=checkbox] + input + label { 
    background-image: url(http://placehold.it/40x40/ff6633/000000?text=yes); 
    height: 40px; 
    width: 40px; 
    display: inline-block; 
    padding: 0 0 0 0px; 
} 

burada çalıştığını örnek görebilirsiniz: Ben gibi pek başka + seçici eklemek zorunda En iyisi değil http://jsfiddle.net/4huzr/2437/

ama ben geçmişte bulunan en kolay çözüm olduğunu :)

Veya @Lgson olarak belirtildiği gibi ~ seçiciyi kullanabilirsiniz.

.yesno input[type=checkbox] ~ label

+0

serin, teşekkürler, ben sadece seçicileri zincirleme sanırım – user3665791