Ошибка новичков в селекторе потомков

Посмотрите на следующий селектор:

cssp.eee {
  color: red;
}

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

html<p class="eee">
  lorem ipsum
</p>
<p class="eee">
  lorem ipsum
</p>

Посмотрите теперь вот на этот селектор:

cssp .eee {
  color: green;
}

Это селектор отличается от предыдущего тем, что у него между именем тега и именем класса стоит пробел. Этот пробел представляет собой селектор потомков. To есть в данном случае мы выбираем все элементы с классом eee, находящиеся внутри абзацев. Например, этот селектор выберет следующие спены:

html<p>
  lorem <span class="eee">ipsum</span>
</p>
<p>
  lorem <span class="eee">ipsum</span>
</p>

Результат выполнения кода:

cssp.bbb {
  color: red;
}

cssp .bbb {
  color: red;
}

css.eee p.bbb {
  color: red;
}

css.eee p .bbb {
  color: red;
}