Border-radius Error

I just ran my page through the CSS validator, validating as CSS3, but keep getting an error, Parse Error [empty string] because of the border-radius attribute I have in my stylesheet. If I remove that line, the stylesheet validates. Why does border-radius fail? It is a CSS3 property.

Here is what that line looks like in my file -

border-radius: 10px 10px 10px 10px;

As far as I can tell, you can’t use such a shortcut for border-radius, so you’ll have to do border-top-left-radius, border-top-right-radius, etc etc. You can only have the one value for border-radius which will effect all of the corners

(Also I’m not sure if the validator understands border-radius yet… I haven’t checked)

It must not recognize it yet.
Validating it as CSS3, just yields four errors now instead of one -


20  	 #container Parse Error  [empty string]
21 	#container 	Parse Error [empty string]
22 	#container 	Parse Error [empty string]
23 	#container 	Parse Error [empty string] 

or as CSS2.1


20  	 #container  Property border-top-left-radius doesn't exist in CSS level 2.1 but exists in : 10px  10px
21 	#container 	Property border-top-right-radius doesn't exist in CSS level 2.1 but exists in : 10px 10px
22 	#container 	Property border-bottom-left-radius doesn't exist in CSS level 2.1 but exists in : 10px 10px
23 	#container 	Property border-bottom-right-radius doesn't exist in CSS level 2.1 but exists in : 10px 10px

Does ‘border-radius: 10px’ validate?

Nope, when I validate I get one of the following errors -

CSS3 - 20 #container - Parse Error [empty string]
CSS2.1 - 20 #container - Property border-radius doesn’t exist in CSS level 2.1 but exists in : 10px 10px

border radius is css3. The validator is 2.1 or something. Just ignore it it’s no big deal.

Or don’t use CSS3 since it’s not a W3C recommendation – meaning it’s NOT for use on production websites yet…

and while CSS3 is in draft, the validator for it is USELESS even on valid CSS, throwing errors on stuff that’s even valid in CSS 2.1 – just ANOTHER reason not to waste your time trying to use it in the first place unless your purpose is to test for and report bugs to the browser makers or make suggestions on the specification itself!

Christmas on a cracker people – STOP jumping the gun using specifications that aren’t even recommendations yet!!!

It seems to be a bug in the validator which as mentioned above is still a work in progress as far as css3 is concerned so I shouldn’t worry about it.

Unlike Jason though I see no harm in using certain features of CSS3 where there is no real harm if the specs are changed at a later date such as in the case of round corners. If the specs are changed you just won’t get round corners which is no great loss.

However I would advise against using any css3 where the structure of a site depends on it because then you may well come unstuck.