CSS rule generates 404 error on some browsers

Question

In my server logs, I get many errors such as this:

File does not exist: /my/path/-moz-linear-gradient(top,white,

This is apparently due to the following piece of Bootstrap CSS, where some browsers must interpret -moz-linear-gradient as a background image to be downloaded:

.btn{
/* some code... */
background-color: whiteSmoke;
background-image: -webkit-gradient(linear,0 0,0 100%,from(white),to(#E6E6E6));
background-image: -webkit-linear-gradient(top,white,#E6E6E6);
background-image: -o-linear-gradient(top,white,#E6E6E6);
background-image: linear-gradient(to bottom,white,#E6E6E6);
background-image: -moz-linear-gradient(top,white,#E6E6E6);
background-repeat: repeat-x;
/* more code...*/
}

How can I prevent such errors from happening? Thank you!

Answer 1

You should use background: instead of background-image: because with background-image you need to set the path of the image and you are not using an image.. but a gradient as background.

This is a Tool that you can use http://www.colorzilla.com/gradient-editor/ to make the gradient and copy the code if you want, all to make it easier and fault free.

Update after all the comments:
You could use a fallback image of the gradient. Like here:

/* fallback image */
background-image: url(images/fallback-gradient.png); 

And that should fix your problem to.