Ярлык фона, если радио проверено

Question

Я хочу, чтобы моя верхняя метка была фон, если переключатель установлен. Я не хочу выделять промежуток фона, потому что фон должен включать в себя переключатель.

<label> 
    <input type="radio" checked="checked"> 
    <span>text</span> 
</label> 

Смотрите мой полный код здесь: https://jsfiddle.net/kL2h46x5/

Как я могу исправить это?

Answer 1

Там нет никакого способа, чтобы выбрать родительский элемент ввода. Но вы могли бы изменить разметку, чтобы достичь желаемого эффекта:

HTML:

<input class="radio-gender bestelling-type" type="radio" checked="checked" onclick="javascript:yesnoCheck();" name="yesno" id="noCheck"> 
<label class="type-bestelling" for="noCheck"> 
    <span class="type-bestelling-particulier">Particulier</span> 
</label> 

<input class="radio-gender bestelling-type" type="radio" onclick="javascript:yesnoCheck();" name="yesno" id="yesCheck"> 
<label class="type-bestelling" for="yesCheck"> 
    <span class="type-bestelling-zakelijk">Zakelijk</span> 
</label> 

CSS:

label.type-bestelling {background-color: #f1f1f1; margin-right:10px;} 

input:checked+label { 
    background:red; 
} 

https://jsfiddle.net/kL2h46x5/9/

Answer 2

https://jsfiddle.net/kL2h46x5/6/

Использование

:checked + span { 
     background-color: #f10; 
}