Почему с помощью #id можно стилизовать сразу же несколько элементов?

Question

[nuzux]

Столкнулся с 1 проблемой и не могу понять логику работы.

Я понимаю, что лучше не использовать #id в селекторах, ибо у него большая приоритетность (100), но вопрос в другом

Я написал 4 div элемента и дал им #test. После я стал писать для них стили и данные стили применились ко всем элементам #test. Насколько это нормально? Разве стили для #id применяются не для 1 элемента?

Просто я читал, что мол у #id высокая приоритетность, потому что стили могут применяться только к 1 элементу, а в данном случае это не так работает

Буду безумно рад, если кто-то объяснит почему этот так работает. Заранее спасибо

Пруф -> https://codepen.io/anon/pen/ZobXLE

Answer 1

[Дмитрий]

сами заставляете браузер нарушать правила
такто он должен выдать ошибку и не показывать ваш кривой код
но так как вас таких много оно както работает

Comments

[nuzux]

Я сам так не пишу. Просто я не понимаю логику браузера, ведь можно было бы сделать так, что если пользователь выбирает элемент #id, то стили должны применяться только к первому элементу (document.querySelector)

Answer 2

[Stalker_RED]

Это очень старая фича - браузер пытается угадать что от него хотели и показать даже страницы с ошибками.
Если он будет по всей строгости работать - очень большая часть сайтов засыпется ошибками.

Ради прикола можно прогнать на эту страничку тостера через валидатор.
https://validator.w3.org/nu/?doc=https%3A%2F%2Ftos...

150 ошибок и предупреждений на ровном месте. Это конечно не ошибки, а просто нестандартные штуки, но если по всей строгости браузер отработает, то что, страницу вообще не показывать?

Answer 3

[Lynn «Кофеман»]

Не «запрещено», а «не рекомендуется».
К тому же это относится только к js. CSS-у всё равно сколько у вас одинаковых id. Подходит под селектор — применяем стили.