Принудительное отображение IE9 как IE8, но все еще с использованием свойств CSS3

Question

Я использую <meta http-equiv="X-UA-Compatible" content="IE=8">, чтобы IE9 отображался как IE8. Это исправило многие мои проблемы, однако, поскольку IE8 не поддерживает box-shadow, я был вынужден использовать filter: progid:DXImageTransform.Microsoft.Shadow(color='#333333', Direction=145, Strength=5);, чтобы получить эффект, аналогичный моей тени. Теперь IE9 поддерживает box-shadow, но я не могу заставить IE9 использовать box-shadow вместо filter.

Кто-нибудь знает, как заставить IE9 визуализировать тень?

Answer 1

Нельзя заставить IE9 использовать его собственный box-shadow, если он находится в режиме IE8.

Вы можете:

• Просто используйте режим IE9 и исправьте свою страницу, чтобы работать в ней - это то, что я бы сделал.
• Используйте CSS3 PIE - он может имитировать box-shadow в IE6-8.

Answer 2

Почему вы заставляете его отображать как IE8, а затем ожидаете, что он будет отображаться как IE9?:) В IE8 не было поддержки box-shadow, поэтому IE9 покорно отключает его при рендеринге как IE8.

Если вы хотите, чтобы IE9 отображал box-shadow, вам придется вернуть его к рендерингу какIE9 или EDGE.Если вы вынуждены поддерживать x-ua-совместимую как есть, тогда вам придется использовать фильтры.

Обратите внимание, что для IE8 используется другой синтаксис ...

/* For IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
/* For IE 5.5 - 7 */
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');

(Пример взят из http://robertnyman.com/2010/03/16/drop-shadow-with-css-for-all-web-browsers/)

Поскольку в идеале это довольно неприятно, я бы посоветовал вам изолировать их в таблице стилей только для IE, поставляемой с условными комментариями.