CSS3 Reference gradients not checking, can anyone tell me why? Sample code inside

Question

Can someone tell me why the following css doesn't check? I try to explore it myself, no luck. All the documentation I read says that this is correct, why do gradients in css3.

#header { color: white; font-size: 12px; font-family: Helvetica, Verdana, Arial, sans-serif; background: black; background: -moz-linear-gradient(top, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.65)), color-stop(100%,rgba(0,0,0,0))); background: -webkit-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); background: -o-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); background: -ms-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); background: linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); width: 100%; height: 35px; margin-top: 0px; margin-left: auto; margin-right: auto; padding: 10px; position: fixed; top: 0px; z-index: 1000; } 

These are the validation errors that I get:

W3C CSS Validation Results for TextArea (CSS Level 3)

Excuse me! We found the following errors (6)

URI: TextArea

6 # Header error: background color -moz-linear-gradient (top, rgba (0,0,0,0,65) 0%, rgba (0,0,0,0,0) 100%) is not a background value: - brain linear gradient (upper, rgba (0,0,0,0,65) 0%, rgba (0,0,0,0,0) 100%)

7 #header Meaning Error: background-color -webkit-gradient (linear, top left, bottom left, color stop (0%, rgba (0,0,0,0,65)), color-stop (100%, rgba (0,0,0,0))) is not a background color: -webkit-gradient (linear, upper left, lower left, stop color (0%, rgba (0,0,0,0,65)) color stop (100%, rgba (0,0,0,0))))

8 #header Meaning Error: background color -webkit-linear-gradient (top, rgba (0,0,0,0,65) 0%, rgba (0,0,0,0,0) 100%) is not a background color value : -webkit-linear-gradient (top, rgba (0,0,0,0,65) 0%, rgba (0,0,0,0,0) 100%)

9 #header Meaning Error: background color - linear gradient (top, rgba (0,0,0,0,65) 0%, rgba (0,0,0,0,0) 100%) is not a background color value: -o-linear gradient (top, RGBA (0,0,0,0,65) 0%, rgba (0,0,0,0,0) 100%)

10 # Header error: background color -ms-linear-gradient (top, rgba (0,0,0,0,65) 0%, rgba (0,0,0,0,0) 100%) is not a background color value: -ms-linear-gradient (top, RGBA (0,0,0,0,65) 0%, rgba (0,0,0,0,0) 100%)

11 #header Meaning Error: background color linear gradient (top, rgba (0,0,0,0,65) 0%, rgba (0,0,0,0,0) 100%) is not the value of the background color: linear gradient ( top, rgba (0,0,0,0,65) 0%, rgba (0,0,0,0,0) 100%)

Answer 1

This is a duplicate: CSS background gradient check

Good explanation:

Valid is a very current term for CSS3 in modern web design / development.

If you tried to check the 'this' code in the W3Cs CSS3 Validator, it will show a bunch of parsing errors. This is because the nature of CSS3 implementation is currently in place, and mainly due to vendor prefixes needed to create CSS3 gradients.

Now on the flip side, we used the correct and “valid” syntax according to browsers for these gradients. The fact that the W3C is not yet completing the CSS3 specification means that before that we are not a concrete answer about what is valid or invalid when it comes to CSS3. All we can do right now is to follow progressive improvement methods and pay attention to browser providers for direction and implementation of CSS3.

http://net.tutsplus.com/tutorials/html-css-techniques/quick-tip-understanding-css3-gradients/comment-page-1/#comment-243334

Answer 2

Special extensions for suppliers do not check . In addition, you may need to change the settings of the W3C validation service to change the level of the CSS profile, as shown in this link .

In any case, I wouldn’t worry that my CSS3 ads are not being tested, as the verification is just a guide for fixing possible code errors.

Answer 3

make sure you have the correct parameter for "profile". It must be css level 3. And the validator does not actually support vendor specific css.