22/31 Слайдер на CSS, шаг 3


Правильно так:

#btn-1:checked ~ .slider-controls label[for=“btn-1”],
#btn-2:checked ~ .slider-controls label[for=“btn-2”],
#btn-3:checked ~ .slider-controls label[for=“btn-3”]{
background-color: #666666
}

А если сделать вот так, использовав nth-child?

#btn-1:checked ~ .slider-controls label:nth-child(1),
#btn-2:checked ~ .slider-controls label:nth-child(2),
#btn-3:checked ~ .slider-controls label:nth-child(3){
background-color: #666666
}

С виду вроде эффект тот же.

А всё, понял, в таком случае будет нормально работать только если больше нет отдельных кнопок с классом slider-controls.