Search code examples
htmlcsswebkitw3c

I am trying to convert a webkit command to moz o and ms

I am trying to find an alternative to the webkit command:

-webkit-text-fill-color

As this isnt yet supported in moz o and ms anyone know of another command which can do this or some sort of css hack i can use to get this effect?

Basically what im doing is making the text invisible, setting the background gradient invisible except where the text is and making that background show through to make a purely css gradiented text. anyone have any ideas? this is how i got it done with webkit:

background-image: -webkit-linear-gradient(top, #3e698c, #30576e);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;

It works great in safari/chrome (duh :P ) but not in ie ff opera maxthon etc etc.

Solution

  • This was resolved in the comments, so putting the comment in an answer to get this question off the unanswered list.

    in place of that use color and webkit-text-fill-color both are same and have a look to this Difference between "-webkit-text-fill-color" and "color"? – Arpit Srivastava Sep 14 '12 at 3:12

    Also, all browsers except for IE support the webkit-text-fill-color even though it's not standard: https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-text-fill-color#Browser_compatibility