Degradado radial compatible con IE9

[sergi_multimedia]

Hola, en mi web que estoy creando he añadido un degradado radial en el fondo. En todos los navegadores funciona correctamente, y como no podía fallar en IE da algunos problemas.

He añadido el código a través de una herramienta online, que siempre utilizo para estas cosas.

http://www.colorzilla.com/gradient-editor/

El código CSS generado es el siguiente:

Código CSS:

background: #ffffff;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPHJhZGlhbEdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNzUlIj4KICAgIDxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjNTQ2NTcwIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L3JhZGlhbEdyYWRpZW50PgogIDxyZWN0IHg9Ii01MCIgeT0iLTUwIiB3aWR0aD0iMTAxIiBoZWlnaHQ9IjEwMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-radial-gradient(center, ellipse cover,  #ffffff 0%, #546570 100%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#ffffff), color-stop(100%,#546570));
background: -webkit-radial-gradient(center, ellipse cover,  #ffffff 0%,#546570 100%);
background: -o-radial-gradient(center, ellipse cover,  #ffffff 0%,#546570 100%);
background: -ms-radial-gradient(center, ellipse cover,  #ffffff 0%,#546570 100%);
background: radial-gradient(ellipse at center,  #ffffff 0%,#546570 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#546570',GradientType=1 );
 

El degradado con IE9 me sale horizontal, y eso que he añadido compatibilidad con IE9 desde la herramienta online.

¿Cómo puedo arreglar esto?

Un saludo ;)

[moro666]

Mira, tu problema es senzillo de resolver, IE no se traga los radiales en css! xD, y yasta.

Pero siempre hay alternativas, que van de poner una foto de fondo con el degradado (no lo recomiendo, pero si nada resulta...) o mirarte esto
http://www.w3schools.com/svg/svg_grad_radial.asp

Esta eramienta llamada SVG, no se si se usa, es buena, mala, o ke, pero es la unica solucion que me se para solucionar este problema con IE!

Espero haber ayudado!

[furoya]

Tal vez no deberías usar esas herramientas si no sabés primero CSS. O tal vez no deberías preguntar en el Foro si primero no buscaste la solución donde corresponde.

Alpha Filter MSDN

Alpha Filter (Editor filtro)

El filtro para gradiente sólo tiene dos direcciones: vertical y horizontal.
Entonces hay que usar una capa con alpha(), que sí tiene un radial.

Pero no olvidés ocultarlo para las versiones superiores a IE8.

[sergi_multimedia]

Iniciado por moro666

Mira, tu problema es senzillo de resolver, IE no se traga los radiales en css! xD, y yasta.

Pero siempre hay alternativas, que van de poner una foto de fondo con el degradado (no lo recomiendo, pero si nada resulta...) o mirarte esto
http://www.w3schools.com/svg/svg_grad_radial.asp

Esta eramienta llamada SVG, no se si se usa, es buena, mala, o ke, pero es la unica solucion que me se para solucionar este problema con IE!

Espero haber ayudado!

Hola! Gracias por pasarte y comentar. Pues la verdad daba por hecho que IE9 soportaba el radial de CSS3, habrá que esperar a IE10 a ver si definitivamente da un soporte total a los estándares web.

Me miraré lo que me comentas, y te digo como ha ido!

Saludos

[sergi_multimedia]

Iniciado por furoya

Tal vez no deberías usar esas herramientas si no sabés primero CSS. O tal vez no deberías preguntar en el Foro si primero no buscaste la solución donde corresponde.

Alpha Filter MSDN

Alpha Filter (Editor filtro)

El filtro para gradiente sólo tiene dos direcciones: vertical y horizontal.
Entonces hay que usar una capa con alpha(), que sí tiene un radial.

Pero no olvidés ocultarlo para las versiones superiores a IE8.

Hola! Gracias por pasarte y comentar. Como comenté a moro666, voy a probar lo que comentas y te digo que tal funcionó ;)

PD: Respecto a tu primer comentario, solo quería aclarar que la mejor manera de aprender herramientas es usándolas, aunque no te falta razón con la búsqueda, veo que se ha hablado ya de este asunto.

[furoya]

Iniciado por sergi_multimedia

Pues la verdad daba por hecho que IE9 soportaba el radial de CSS3, habrá que esperar a IE10 a ver si definitivamente da un soporte total a los estándares web.

Bueno, quizá mi excusa es que no lo uso, pero yo también daba por hecho que era soportado por IE9. Por eso mi recomendación de ocultar el filtro.

Recién es un proyecto para IE10

http://blogs.msdn.com/b/ie/archive/2...preview-1.aspx

[pzin]

Yo llevo esperando a que IE saque cosas desde la 5.5...