Почему нет: nth-child работает в IE9?

В соответствии с эта страница: nth-child должен работать в IE9, и я пробовал его раньше, и он работал нормально, но на эта страница, она не работает. Просмотрите страницу в Chrome, чтобы увидеть предполагаемое поведение, и в IE вы увидите, что она не работает. Вероятно, вы можете увидеть это с помощью веб-инспектора, но для вашей ссылки соответствующие строки CSS:

.ad_widget:nth-child(3n+2) { background: #efefef; }
.ad_mrow {background: #efefef;}`

Я в недоумении. Любые идеи?

Ответы

Ответ 1

По какой-то причине я не могу понять, IE9 по умолчанию использует режим совместимости для просмотра сайтов интрасети или HTML-страницу, хранящуюся как файл на ПК. Режим совместимости означает "визуализировать материал как немой старый браузер". Это означает, что когда вы разрабатываете материал для веб-сайта, и вы пытаетесь просмотреть его из своей любимой среды IDE в IE9, ни один из материалов CSS3 не работает. Вы должны нажать Tools → 'параметры просмотра совместимости' в меню IE9, а затем снять флажок с надписью "Показывать межсетевые сайты в представлении совместимости". С этого момента жалкий браузер работает как любой здравомыслящий браузер, такой как Safari. Почему они это сделали? Небеса знают только, но мне потребовалось много времени, чтобы обнаружить это простое исправление из-за того, что я продолжал обвинять мой код.

Ответ 2

Они выглядят одинаково здесь. Вы уверены, что не находитесь в режиме совместимости?

Ответ 3

Моя версия IE9 была заблокирована в режиме рендеринга IE8, который не применял следующий селектор:

 .parentClass > div:nth-child(n+2) .childClass

Здесь вы можете найти варианты его изменения:

Where in IE9 to Adjust Browser and Document mode

Ответ 4

Кажется, он работает для меня. IE9

Chrome

Ответ 5

<!DOCTYPE html> не остановит режим quirk, <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> делает.