Question

Im developing an application in PhoneGap and use Bootstrap to get a gradient on my buttons. When I use the bootstrap button generator I receive this:

text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
background-color: #CEEDF5;
*background-color: #CEEDF5;
background-image: -moz-linear-gradient(top, #F7FBFC, #CEEDF5);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#F7FBFC), to(#CEEDF5));
background-image: -webkit-linear-gradient(top, #F7FBFC, #CEEDF5);
background-image: -o-linear-gradient(top, #F7FBFC, #CEEDF5);
background-image: linear-gradient(to bottom, #F7FBFC, #CEEDF5);
background-repeat: repeat-x;
border-color: #CEEDF5;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F7FBFC', endColorstr='#CEEDF5', GradientType=0);
filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);

It is a mobile application (not a web app), and I'm wondering if I need all of it for Android and iPhone. I'm trying to optimize my code...

Was it helpful?

Solution

Use the -webkit- prefix to catch Blackberry and recent non-current versions of Android and iOS. Drop the rest.

http://caniuse.com/#search=gradient

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top