Испытание: статистика браузеров [19/31]

У меня такой вопрос. Вот мне в задании перед chrome, firefox … safari надо поставить блок, разноцветный. Почему не достаточно свойства li::before, оно же получается добавит перед каждым “li” элементом блок, для чего писать ещё “li[data-name=“Safari”]::after”. Проверил, без этого блоки не высвечиваются. По моей логике одного “li::before” достаточно. Может объяснить почему я не прав?

ну вы либо before, либо after используйте, это вообще не важно. вместе то зачем?
последующими селекторами вы просто красите квадраты и все

у вас есть псевдоэлементы к li, первым селектором вы им задаете вид 15х15 серого квадратика для всех в определенных координатах на абсолютной сетке
следующими селекторами вы меняете цвет конкретного квадратика