Ссылка на идентификатор в CSS не работает, но ссылка на класс работает

Question

Поэтому я работаю над созданием веб-сайта для публикации своих игр Unity, и я столкнулся с проблемой, которой у меня никогда не было прежде.

Когда я использую идентификатор в качестве ссылки в моем CSS, он не работает, но когда я использую ссылку на класс, он работает.

Вот мой HTML & CSS:

#notes {
  padding: 20px;
}

.boxes {
  background-color: #dee3e2;
  border-radius: 20px;
}

.boxes h1 {
  color: #0c7b93;
}

body {
  background-color: #de7119;
  font-family: sans-serif;
}

<div class="boxes" id="notes">
  <h1>Notes:</h1>
  <ul>
    <li>Color Scheme is Bad.</li>
    <li>Code is Messy.</li>
    <li>My Games Still Suck.</li>
  </ul>
</div>

Answer 1

Не уверен, почему это происходит. Все, что я знаю о CSS, говорит о том, что это должно работать.

Однако рекомендуется не использовать идентификаторы в качестве селекторов CSS. Причина, по которой обрисована в общих чертах, очень хорошо описана: https://github.com/CSSLint/csslint/wiki/Disallow-ids-in-selectors

Извините, если это не очень хороший ответ, но я бы настоятельно рекомендовал использовать классы над идентификаторами для элементов таргетинга для CSS