The reason why you're getting warnings from Chrome's dev tool is because the values are indeed invalid for Chrome. However, this should not alarm you because this is the way that it was designed.
In CSS, if something is defined incorrectly or not recognized by the browser then it is simply passed over, nothing is done and it only gives a warning not an error. This behavior is exactly what allows vendor prefixes to work. Take for example your own situation:
background: right no-repeat url('../Images/CompanyLogo.png'),
-moz-linear-gradient(bottom, #000000, #ffffff);
background: right no-repeat url('../Images/CompanyLogo.png'),
-webkit-linear-gradient(bottom, #000000, #ffffff);
background: right no-repeat url('../Images/CompanyLogo.png'),
linear-gradient(bottom, #000000, #ffffff);
Chrome goes through each background
property and sees which one it can interpret. It can't interpret the first gradient because it doesn't recognize -moz-
like Firefox does. It can interpret the second one because it has a -webkit-
prefix. It can also interpret the third background because Chrome supports un-prefixed CSS gradients.
Since more than one CSS attributes affect the same thing (background
), the most recent one listed (the unprefixed version) will be used. A warning will display for the un-interpretted first background
, but it will have no effect on the project.
Yes, warnings should be looked at and analyzed, generally treated as errors. With that being said, the case you bring up about browser prefixes is the correct way of doing it, so the warnings should be accepted. In a perfect world they would not show up at all, they'd understand that it is meant for another browser, but there is no reason to worry about it because it is indeed the correct way of doing it
But then again, this is all semi irrelevant because all major browsers support CSS gradients unprefixed.