Ver Mensaje Individual
  #1 (permalink)  
Antiguo 15/08/2012, 03:59
LoGaNsF
 
Fecha de Ingreso: mayo-2006
Ubicación: Sevilla
Mensajes: 33
Antigüedad: 8 años, 5 meses
Puntos: 0
Hover + linear-gradient (IE)

Hola,

Estoy creando una web personal, algo en plan curriculum, para colgar mis trabajos, mi curriculum y para que contacten conmigo que hay que currar jeje. La base de la web es Chrome y Firefox ya que estoy con HTML5 y algo de CSS3, y por mi pasaría completamente de IE, pero al ser una web para ofrecer mis servicios, no queda muy bien que no funcione en el navegador mas utilizado... por desgracia.

El caso es que tengo un menú fijo en la parte superior con un degradado (con CSS3 PIE ya logre que funcionara en IE) y para los botones, cuando me pongo encima del enlace le cambio el fondo por un degradado que hace un efecto como si se iluminara el texto por abajo. En Chrome y Firefox va perfecto, pero en IE no funciona, ni siquiera en el 9. Os pego el codigo:

Código HTML:
nav#menu ul li#home a:hover{
  color: #61ACE4;
  background: -webkit-linear-gradient(top, rgba(97,172,228,0) 30%,rgba(97,172,228,0.1) 60%,rgba(97,172,228,0.3) 100%);
  background: -moz-linear-gradient(top, rgba(97,172,228,0) 30%,rgba(97,172,228,0.1) 60%,rgba(97,172,228,0.3) 100%);
  background: -o-linear-gradient(top, rgba(97,172,228,0) 30%,rgba(97,172,228,0.1) 60%,rgba(97,172,228,0.3) 100%);
  background: -ms-linear-gradient(top, rgba(97,172,228,0) 30%,rgba(97,172,228,0.1) 60%,rgba(97,172,228,0.3) 100%);
  background: linear-gradient(top, rgba(97,172,228,0) 30%,rgba(97,172,228,0.1) 60%,rgba(97,172,228,0.3) 100%);
}
Cada enlace tiene un color, este es de uno de ellos. Como no es compatible con CSS3 pues usando CSS3 PIE logre hacer el degradado para el menu, pero en los botones no funciona. Esto es lo que uso para el degradado en IE:

Código HTML:
...
-pie-background: linear-gradient(#F3F3F3 20%, #E6E6E6 100%);
behavior: url(PIE.htc);
...
Se lo añado al primer estilo indicado, pero no hace nada. He estado buscando y he leído problemas con hover en IE8 e IE7, no se si esto tiene que ver. Lo que si me cambia es el color de la letra, pero el fondo no.

A ver si me podéis echar una mano, me gustaría que al menos eso se viese igual en todos los navegadores o por lo menos en IE9.

Gracias.