2009-11-20 16 views
88

Estoy usando la propiedad propietaria MS 'filter' para intentar crear un equivalente no feo a css3 text-shadow y box-shadow;¿Cómo reinicio o anulo los filtros CSS de IE?

De hecho, me iba muy bien hasta que llegué a 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.

No puedo explicarlo mucho mejor que eso, he aquí una demostración: http://cableflow.dev.arc.net.au/test/filters.html

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

Testing en IE8

+8

Esto funciona para mí: 'filtro:;' –

+1

filtro :; no funciona con lessphp css preprocessor, filter: -; hace sin embargo. –

+0

use 'filter:;'. esto supongo obligará al IE a eliminar la propiedad, ya que no es un valor válido. –

Respuesta

6

que he tenido cierto éxito mediante la colocación de los niños absoluta o relativa. Esto no pareció funcionar antes, por lo que puede volver a romperse una vez que me vuelvo más complicado

Creo que una vez que un padre aplica un filtro, todos sus hijos se vuelven superficies de directx internamente. Aún puede seleccionar texto, pero queda rezagado. Creo que la selección de texto es un truco que hace que cada letra sea una superficie separada. Es un lío de mierda que explica en gran medida por qué el navegador en general y los filtros en particular son tan problemáticos.

+0

funcionó para mí. ¡Muchas gracias! – molf

16

prueba esto:

filtro: -;

+0

Funcionó para mí en IE7 mientras -ms-filter: "progid: DXImageTransform.Microsoft.gradient (enabled = false)"; no lo hizo.Thx –

+0

@SimonArnold "-ms-filter" solo es compatible con IE8 y superior; IE7 solo es compatible con el atributo "filtro". Vea http://msdn.microsoft.com/en-us/library/ie/ms530752(v=vs.85).aspx. – vee

95

Hay atributo booleano habilitado, para lo cual se puede establecer falsa o cierto http://msdn.microsoft.com/en-us/library/ms532997%28v=vs.85%29.aspx

Ejemplo:

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

Para mí esto funcionó, pero tuve que usar '! Important' –

+1

¡Gracias! Esto funcionó para mí dos. Tenía un estilo de fondo molesto que no desaparecía y no podía encontrarlo, sin importar cuánto lo intentara. – racl101

+0

Gracias! los filtros de degradado para botones no funcionan bien con algunos botones con imágenes de fondo, el filtro aparece sobre la imagen ... – Adam

0

he encontrado la mejor manera es display: inline -block (aplicando espacio en blanco: nowrap al contenedor). Pero parece que funciona mal con IE7 e inferior

6

Si está utilizando HTML5 es posible que desee seguir el camino de la utilización de

<!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 CSS en su uso algo como:

.ie9 .element {filter: none; } 
20

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

Cuestiones relacionadas