# id # id: повторяющиеся вхождения одного и того же простого селектора должны повысить специфичность, но не для идентификаторов в IE9
В течение некоторого времени я использую небольшой трюк, который, как я думал, был умным.
Это объединение одного и того же селектора css для добавления специфики к селектору правил.
Спецификации CSS упоминают:
Примечание. Повторяются записи одного и того же простого селектора и увеличивают специфичность.
http://www.w3.org/TR/css3-selectors/#specificity
Например, если HTML
<body>
<section id="main">
<header class="titles">
<h2>Title red</h2>
<h2 class="blue">Title blue</h2>
</header>
<h2 class="blue">Title blue</h2>
</section>
</body>
И CSS
#main .titles h2{
color: red;
}
#main .blue.blue{
color: blue;
}
Таким образом, я могу использовать класс .blue
для переопределения стилей, события в заголовке...
(Я делаю это, потому что ненавижу использовать !important
. Мне это следует избегать любой ценой.)
Первый селектор весит 0111 (1 id, 1 класс, 1 элемент)
Второй селектор весит 0120 (1 id, 2 класса)
Иногда я делаю это с идентификаторами. И это работает... в реальных браузерах...
Этот селектор:
#main#main .blue{}
должен весить 0200, так как он получил 2 идентификатора справа?
Ну IE9 (не пробовал другие) не интерпретирует несколько идентичных идентификаторов в селекторах.
Этот селектор не будет переопределять #main .titles h2{}
в IE9...
Консоль IE css показывает вычисленный селектор, равный #main .blue
, и удаляет второе вхождение...
Почему это?
Для меня это еще одна ошибка в реализации IE.
Как предположил @BoltClock, я подал отчет здесь:
https://connect.microsoft.com/IE/feedbackdetail/view/958790/repeated-occurrences-of-the-same-simple-selector-should-increase-specificity-even-with-ids
Ответы
Ответ 1
Да, судя по поведению, показанному в F12, это определенно ошибка. Это также является нарушением спецификации, если вы интерпретируете "увеличиваете специфичность" как "должны увеличивать специфичность". Эта проблема, похоже, влияет только на селекторы идентификаторов. Селектора классов, селектора атрибутов и псевдоклассы в порядке.
Это, как сообщается, ранее, как при поиске Microsoft Connect, он отображает существующий отчет, но я не могу его просмотреть по какой-то причине. Этот вопрос все еще присутствует в IE11; если вы не можете просмотреть отчет, не стесняйтесь записывать еще один.