CSS file keeps changing

Question

I have the following CSS in my main.css file:

background-image:-moz-linear-gradient(top, #eeeeee, #aaaaaa) !important;
background-image:-webkit-gradient(linear, 0 0, 0 100%, from(#eeeeee), to(#aaaaaa)) !important;
background-image:-webkit-linear-gradient(top, #eeeeee, #aaaaaa) !important;
background-image:-o-linear-gradient(top, #eeeeee, #aaaaaa) !important;
background-image:linear-gradient(to bottom, #eeeeee, #aaaaaa) !important;
background-repeat:repeat-x;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee', endColorstr='#ffaaaaaa', GradientType=0) !important;

Which keeps changing itself to:

background-image: linear-gradient(to bottom, #eeeeee, #aaaaaa) !important;

Why could this be happening? The selector is .navbar .nav which is defined in another CSS file too, the Bootstrap CSS file. Could it be that Visual Studio is automatically cleaning up duplicate definitions or something?

edit: It changes every few builds. I can't pinpoint what action is causing it to automatically change.

Answer 1

Those are browser based CSS tags:

This only works in mozilla:

background-image:-moz-linear-gradient(top, #eeeeee, #aaaaaa) !important;

Works in Chrome/Webkit based browsers:

background-image:-webkit-gradient(linear, 0 0, 0 100%, from(#eeeeee), to(#aaaaaa)) !important;
background-image:-webkit-linear-gradient(top, #eeeeee, #aaaaaa) !important;

Actually this cross browser technique is somewhat deprecated in the release of CSS3. You need to find the corresponding CSS that works on the browser you are using.

It's not 'changing' just that, other CSS was ignored by the browser.

Answer 2

Have a look to see if there are any build events setup in Visual Studio. It's possible the project has been configured to run something like csstidy or a css minimizer that is attempting to cleanup duplicate properties.

Alternatively, if you're using source control (which I would hope you are), your source control may be configured to run a commit hook that does the same sort of thing. How that is configured will depend on the source control that you're using.

I wouldn't expect this to be a problem with a modern version of csstidy (or any other modern css optimising tool for that matter). However, if this is a project that you've inherited, it's possible it was setup some time ago with a tool that is now out of date.