Vouloir remplacer DXImageTransform pour rendre compatible FireFox/Chrome

Question

Le morceau de code suivant ne fonctionne pas sur FF et Chrome mais fonctionne sur IE. Je veux remplacer cette partie pour m'assurer qu'elle fonctionne sur tous les navigateurs.

Quelqu'un a une idée ?

Code ci-dessous :

<td width="50%"  style="FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=1,startColorStr=#163866,endColorStr=#8bc9f3); HEIGHT: 38px;">

Answer 1

td {
   background: -webkit-gradient(linear, left top, left 38, from(#163866), to(#8bc9f3));
   background: -moz-linear-gradient(top, #163866, #8bc9f3 38px);
   FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=1,startColorStr=#163866,endColorStr=#8bc9f3)
   height: 38px;
}

Cela fonctionnera dans FF 3.6+, Safari 4+, Chrome, et IE 6+ (je pense que cela supporte les filtres de dégradés). Chaque navigateur ignorera les déclarations qu'il ne comprend pas, donc avoir les 3 permettra de supporter tous les principaux navigateurs. Opera ne prend pas encore en charge les dégradés, mais utilise plutôt le SVG (Scalable Vector Graphics).

Documentation sur le dégradé de Firefox

Documentation sur les dégradés de Webkit (Safari/Chrome)

Gradients d'opéra