Псевдокласс :checked[13/18]

Всем элементам label стоящим после отмеченных элементов input установите цвет текста #1abc9c
Цель 2 : Используя селектор отрицания, всем элементам input, которые не отмечены checked установите отступ справа 15px

И что?

1 лайк

input:checked + label {
color: #1abc9c;
}

input:not(:checked) {
margin-right: 15px;
}

3 лайка

@Ineska сперва задание привело в ступор. :slight_smile: Я оставил его и перешел к другим заданиям, потом в конце этой части(Селекторы, часть 3) вспомнил про ~ селектор последующих элементов . Спасибо всем :+1: :thumbsup:

Разный результат, но засчитывает:

input:checked + label { color: #1abc9c; }
и

input:checked ~ label { color: #1abc9c; }

Почему разный?

input:checked ~ label закрашивает все элементы после выбранных checked-box, там последний элемент, который не нужно закрашивать
input:checked + label закрашивает только один элемент после выбранного checked-box.

Я когда выполнял это задание, перепутал и написал неправильно: input:checked ~ label . Цель была достигнута, но я не мог понять почему. Так как в результате у меня был закрашен лишний элемент в checked-box

Исправил проверку, спасибо.