Условные комментарии для IE

Условные комментарии более не поддерживаются

Поддержка условных комментариев в стандартном режиме и режиме совместимости Internet Explorer 10 была удалена для улучшения взаимодействия и совместимости с HTML5. Это означает, что условные комментарии теперь обрабатываются как обычные комментарии, так же как в других браузерах. Это изменение может повлиять на страницы, написанные специально для Windows Internet Explorer, или страницы, использующие определитель браузера и подстраивающиеся под Internet Explorer.

Примечание На большинство страниц это изменение не оказывает влияния.

Страница, использующая условные комментарии, работает нормально в Windows Internet Explorer 9, но не работает в Internet Explorer 10.

Если эта страница нормально работает в других браузерах, попробуйте использовать обнаружение возможностей, чтобы взаимодействовать с Internet Explorer 10, так же как с другими браузерами. Либо добавьте в начало страницы следующий тег meta, задающий выбор поведения Internet Explorer 9:

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9">

а следующей странице используются условные комментарии, поэтому на нее может повлиять данное изменение.

<html>
  <!--[if IE]>
    This content is ignored in IE10 and other browsers.
    In older versions of IE it renders as part of the page.
  <![endif]-->
</html>

Страницу можно быстро исправить, выбрав поведение Internet Explorer 9, как показано ниже.

<html>
  <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9">
  <!--[if IE]>
    This content is ignored in Internet Explorer 10 and other browsers.
    In older versions of Internet Explorer, it renders as part of the page.
  <![endif]-->
</html>

Более основательным решением является удаление зависимости из кода.

Альтернативные варианты

Хак @media Zero Hack

@media screen and (min-width:0\0) { 
    /* стили только для IE9 - IE10 */ 
}

Хак @media -ms-high-contrast

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
   /* стили только для IE10 */
}

Хак @cc_on

<!--[if !IE]><!-->
<script>if(/*@cc_on!@*/false){document.documentElement.className+=' ie10';}</script>
<!--<![endif]-->

После применения данного хака в IE10 к тегу будет добавлен класс ie10. Теперь достаточно написать в CSS:

.ie10 .element { 
   /* стили только для IE10 */ 
}
Анимация SVG

Есть много разных способов анимировать SVG-изображения. Сейчас я рассмотрю и сделаю себе пометки, как сделать…

Кроссбраузерный GrayScale с поддержкой Internet Explorer 10

Пример кроссбраузерного варианта сделать картинку черно-белой с помощью CSS. IE11 не поддерживает filter. img.grayscale {…

Примеры использования селектора :checked с помощью jQuery

Селектор :checked работает для чекбоксов, радио кнопок и для опций выпадающих списков (select). Чтобы получить…

Добавляем на сайт лоадер (спиннер)

Loader — это иконка-спиннер, которая крутится, пока загружается ваша страница. Так то я против таких…

1 комментарий

Мария

Спасибо!
Возникла проблема с ИЕ, причём он не видел только высоту строки у одного элемента. У всех видел, а у этого — нет. С помощью Вашей статьи решила проблему за 2 секунды.

Ответить