Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to validate vendor prefixes in CSS like -webkit- and -moz-?

I use the webkit/mozilla border radius and box shadow CSS properties, but I want the CSS to validate (which it currently does not). Is there a way to get it to validate?

http://jigsaw.w3.org/css-validator/

like image 292
a432511 Avatar asked Dec 11 '09 17:12

a432511


2 Answers

Although the syntax for vendor extensions is mentioned in the CSS3 Syntax module and introduced into the grammar to allow vendors to implement their own prefixes ignoring the standard, the actual vendor extensions themselves are not recognized as official CSS properties. This is not going to change, as they're proprietary and specific to the vendors that invent and use them.

However, a recent enhancement (early 2011) to the Jigsaw W3C CSS Validator makes it possible to reduce validation errors triggered by vendor extensions to warnings. Find this new option among other such as the level of CSS to validate against by expanding the More Options section:

This makes it easier to find the real problems with your stylesheet if it still doesn't validate. If vendor extensions are the only things triggering errors, turning them into warnings will allow your stylesheet to validate tentatively. It also eliminates the need to maintain vendor extensions in a separate stylesheet that you have to hide from the validator.

Warnings are the furthest you can shy away from errors, though, as ultimately, vendor prefixes are still non-standard and therefore technically invalid CSS.

like image 53
BoltClock Avatar answered Oct 21 '22 04:10

BoltClock


No, they are browser specific properties, and not defined in the standard CSS specification.

That being said, they correctly follow the rules for vendor specific extension of CSS. It's just not in the W3C official CSS specification.

like image 28
womp Avatar answered Oct 21 '22 03:10

womp