search

scottjehl / Device-Bugs

Just a collection of quirks and issues that occur on browser platforms (particularly those unlikely to update)
864 stars 19 forks source link

Creating gradient filled text doesn't work in Android Browser #51

Open stowball opened 10 years ago

stowball commented 10 years ago

Some devs use a combination of linear-gradient, -webkit-background-clip & -webkit-text-fill-color to create gradient-fillled text, like so:

background: -webkit-linear-gradient(#000 0%, #f00 100%) repeat-x;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;

Unfortunately, this doesn't work in the Android Browser (tested up to 4.3) resulting in a solid, gradient block of color with no readable text.

gradient-text-android-browser