2011-08-31 17 views
8

Estoy utilizando el siguiente bit de CSS para crear un degradado de fondo lineal. Parece funcionar bien en IE8/9, FF, Safari y Chrome, pero no en IE7. IE7 muestra un fondo sólido (verde). Aquí está mi códigogradientes de fondo en IE7 con CSS

.menu_body a { 
    display:block; 
    color:#006699; 
    background: #008800; 
    /* Mozilla: */ 
    background: -moz-linear-gradient(top, #0b71a4, #025f8e); 
    /* Chrome, Safari:*/ 
    background: -webkit-gradient(linear, 
      left top, left bottom, from(#0b71a4), to(#025f8e)); 
    /* MSIE */ 
    filter: progid:DXImageTransform.Microsoft.Gradient(
      StartColorStr='#0b71a4', EndColorStr='#025f8e', GradientType=0); 
    padding: 1px 18px; 
} 

Respuesta

18

En IE < = 7, los filtros no funcionarán a menos que el elemento tenga layout.

zoom: 1; 

ser consciente de que puede romper otras cosas, tan vieja buena background-image puede haber solución segura y fiable.

También tenga en cuenta que su CSS carece de propiedades de degradado para Opera, IE10 y la sintaxis actualizada de Webkit.

+1

¡Gracias funcionó de maravilla! (No pude votar porque soy un miembro nuevo, lo siento) EDIT: para la sintaxis actualizada de Webkit puedo usar -webkit-linear-gradient() ¿no? – Kiwi1

+0

@Schimmel Correcto; la sintaxis es la misma que para Firefox e IE10, excepto por el prefijo de un proveedor diferente. Por cierto, debería poder aceptar mi respuesta haciendo clic en la casilla de verificación a la izquierda. – duri

+0

@duri - IE10? es eso algo nuevo? :) – Dementic

0

estoy seguro si los parámetros de esta transformación se mayúsculas y minúsculas - pero ya que la mayoría de otros CSS es decir, usted podría intentar:

startColorstr='#0b71a4', endColorstr='#025f8e' 

Aviso el menor de los casos a partir carácter y en minúsculas str sufijo.

+0

Intenté su solución, pero desafortunadamente no funcionó. También traté de darles a todas las instancias cassettes inferiores, pero eso tampoco pareció funcionar. – Kiwi1

+0

Pruebe con 'progid: DXImageTransform.Microsoft.gradient', también - observe' gradiente' en minúsculas. –

+0

Gracias por su respuesta rápida nuevamente, pero lamentablemente esto tampoco funcionó. Estoy realmente confundido porque según el siguiente documento esta transformación debería funcionar para Internet Explorer 5.5 o posterior. Ver: http://msdn.microsoft.com/en-us/library/ms532997%28v=vs.85%29.aspx – Kiwi1

2

La sintaxis correcta es:

filter: progid:DXImageTransform.Microsoft.gradient 
(startColorstr=#550000FF, endColorstr=#55FFFF00) 

Esto es apoyado por IE4>

Ver la fuente de MSDN here.