¿Cómo restablezco o anulo los filtros CSS de IE?

89

Estoy usando la propiedad 'filter' de MS para intentar crear un equivalente no feo a css3 text-shadow y box-shadow;

De hecho, lo estaba haciendo muy bien hasta que encontré este problema. Parece que cuando aplico un filtro a un div dentro de otro div que también tiene un filtro, los efectos del filtro terminan combinándose en el objeto secundario.

He intentado usar filter: none; para hacer un reinicio pero sin alegría. También probé diferentes variaciones en la sintaxis, es decir, "-ms-filter: 'progid: ... Glow ()'", "filter: progid: ... Glow ()", "filter: Glow ()" , etc.

Pruebas en IE8

css filter internet-explorer Empalme
fuente
8
Esto funciona para mí:filter:;
Web_Designer
1
filtrar:; no funciona con el preprocesador de lessphp css, filtro: -; aunque lo hace.
David Meister
utilizar filter: ;. esto, supongo, obligará al IE a eliminar la propiedad por completo, ya que no es un valor válido.
Bhumi Singhal
3
Usando SCSS, tuve que usarlo filter:none;para evitar errores de sintaxis.
Nic Barbier

Respuestas:

95

Hay un atributo booleano habilitado , para el cual puede establecer falso o verdadero http://msdn.microsoft.com/en-us/library/ms532997%28v=vs.85%29.aspx

Ejemplo:

-ms-filter: "progid:DXImageTransform.Microsoft.gradient(enabled=false)";
el22or
fuente
1
¡Gracias! Esto funcionó para mí dos. Tenía un estilo de fondo molesto que no desaparecía y no podía encontrarlo por mucho que lo intentara.
racl101
¡Gracias! los filtros de degradado para los botones no funcionan bien con ciertos botones con imágenes de fondo; el filtro aparece sobre la imagen ...
Adam
¡Trabajado como un encanto! ¡Gracias!
Bogdan
20

La propiedad -ms-filter es una entrada de CSS específica del navegador no estándar y, como tal, requiere que su parámetro esté entre comillas. Entonces, -ms-filter: "none" funcionará bien.

Pato rosa
fuente
16

prueba esto:

filtro: -;

Browzah
fuente
Funcionó para mí en IE7 mientras -ms-filter: "progid: DXImageTransform.Microsoft.gradient (enabled = false)"; no lo hizo. Thx
Simon Arnold
@SimonArnold "-ms-filter" solo es compatible con IE8 y versiones posteriores; IE7 solo admite el atributo "filtro". Consulte msdn.microsoft.com/en-us/library/ie/ms530752(v=vs.85).aspx .
vee
6

He tenido cierto éxito al posicionar a los niños de forma absoluta o relativa. Sin embargo, esto no pareció funcionar antes, por lo que puede romperse nuevamente una vez que me vuelva más complicado

Creo que una vez que un padre tiene un filtro aplicado, todos sus hijos esencialmente se convierten en superficies directx internamente. Aún puede seleccionar texto pero se retrasa. Creo que la selección de texto es un truco que hace que cada letra sea una superficie separada. Es un desastre de mierda que explica en gran medida por qué el navegador en general y los filtros en particular tienen tantos errores.

Empalme
fuente
6

Si está utilizando HTML5, es posible que desee seguir la ruta de usar 

<!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]-->

y en tu CSS usa algo como:

.ie9 .element {filter: none; }
Juan C
fuente
0

Encontré que la mejor manera es display: inline-block (aplicando espacios en blanco: nowrap al contenedor). Pero parece funcionar mal con IE7 y versiones inferiores

max
fuente