Как сделать reset или переопределить фильтры IE CSS?

Я использую свойство proprietry MS 'filter', чтобы попытаться создать не уродливый эквивалент css3 text-shadow и box-shadow;

Я действительно хорошо себя чувствовал, пока не ударил эту проблему. Похоже, когда я применяю фильтр к div внутри другого div, у которого также есть фильтр, эффекты фильтра объединяются в дочерний объект.

Я не могу объяснить это намного лучше, чем здесь, здесь демо: http://cableflow.dev.arc.net.au/test/filters.html

Я пробовал использовать фильтр: none; сделать reset, но не радость. Я также пробовал разные варианты синтаксиса: "-ms-filter:" progid:... Glow() "," filter: progid:... Glow() "," filter: Glow() ", и т.д.

Тестирование в IE8

Ответ 1

У меня был некоторый успех, поставив детей абсолютными или относительными. Раньше это работало не так, как будто это может сломаться снова, когда я усложнюсь

Я думаю, что когда у родителя есть фильтр, все его дети по существу становятся внутренними поверхностями directx. Вы можете выбрать текст, но он отстает. Я думаю, что выбор текста - это взлом, который делает каждую букву отдельной поверхностью. Это дерьмовый беспорядок, который долгий путь объясняет, почему браузер в целом и фильтры, в частности, настолько ошибочны.

Ответ 2

Включен атрибут boolean, для которого вы можете установить false или true http://msdn.microsoft.com/en-us/library/ms532997%28v=vs.85%29.aspx

Пример:

-ms-filter: "progid:DXImageTransform.Microsoft.gradient(enabled=false)";

Ответ 3

Свойство -ms-filter - это нестандартная CSS-запись, специфичная для браузера, и как таковая требует, чтобы ее параметр был заключен с кавычками. So -ms-filter: "none" будет работать нормально.

Ответ 4

попробуйте следующее:

фильтр: -;

Ответ 5

Если вы используете HTML5, вы можете пойти по пути использования

<!doctype html>
<!--[if lt IE 7 ]> <html lang="en" class="ie6 oldie"> <![endif]-->
<!--[if IE 7 ]>    <html lang="en" class="ie7 oldie"> <![endif]-->
<!--[if IE 8 ]>    <html lang="en" class="ie8 oldie"> <![endif]-->
<!--[if IE 9 ]>    <html lang="en" class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<html lang="en" class="gtie9 modern">
<!--<![endif]-->

и в вашем CSS используйте что-то вроде:

.ie9 .element {filter: none; }

Ответ 6

Вы пытались включить/отключить фильтр (ы)?

Ответ 7

Я нашел, что лучший способ - отображение: inline-block (применение white-space: nowrap к контейнеру). Но, похоже, он плохо работает с IE7 и ниже