homepage Welcome to WebmasterWorld Guest from 54.243.23.129
register, free tools, login, search, subscribe, help, library, announcements, recent posts, open posts,
Subscribe to WebmasterWorld
Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: DrDoc

CSS Forum

    
CSS3 Validation
Ashie73




msg:4277289
 11:11 pm on Mar 5, 2011 (gmt 0)

Hi All,

I have just tried to validate my site CSS and I have 42 CSS3 errors, most of which seem to relate to browser specific commands: i.e.

Property -moz-border-radius doesn't exist : 3px 3px
Property -webkit-border-radius doesn't exist : 3px 3px

and Parse Error [empty string] for i.e specific like border-radius: 3px;

Should this be errors I try and resolve to validate if the actual CSS works fine on the browsers? Are there any reprecautions from having non validating CSS?

The link is [edit]

Any advice, thanks?

[edited by: alt131 at 7:36 pm (utc) on Jul 9, 2011]
[edit reason] Thread Tidy - 404 [/edit]

 

alt131




msg:4277763
 1:19 pm on Mar 7, 2011 (gmt 0)

Hi Ashley, good to see you back - and fantastic for validating.

I think you must have validated css2.1 - there are less errors in the Validation results [validator.w3.org] for css3.

Should this be errors I try and resolve to validate if the actual CSS works fine on the browsers?
One reason you may get few responses is because this question comes up a lot, and it's actually complex to answer. Check out the first couple of posts in validating CSS [webmasterworld.com] for some approaches.

So the first question to ask yourself is why you are validating.

Are there any reprecautions from having non validating CSS?
Given you're validating css3, you've already decided to use a recommendation that not fully implemented at this stage. So the consequences of invalid css will depend on the types of errors and warnings - and whether the repercussions are important to you.

Vendor-specific extensions should not affect other browsers. So the only repercussion of the reported error is that users of other browsers/versions will not enjoy that visual effect. But you decided to provide a different user experience when you decided to use the vendor-specific extension, so it's not so much a validation issue as a design/user experience issue.

However, as you're concerned about validation I would suggest to check the Moz documentation
https://developer.mozilla.org/en/CSS_Reference]CSS Reference
and
https://developer.mozilla.org/en/CSS_Reference#Mozilla_CSS_Extensions
for information about the extensions and when the css3 propety was adopted/implemented. Depending on your target audience, you may be able to remove the vendor-specific extension and just use the css3 property.

The parse errors may indicate missing colons or closing braces which you will want to check. However, I also understand there were issues with the draft and it wasn;t certain how many values had to be entered. A search on border-radius should produce up-to-date information.

I'd also check the warnings: I know over 600 seems a lot, but almost all are about colour/background issues, and many are due to the cascade - so fixing an early issue will resolve a lot of later ones. Plus you may not have to do anything - frequently inheritance means there will not be an issue, but given the nature of the site content I'd imagine accessibility would be high priority, so you'd want to double-check that the text colour was different from the background-color to make sure it was still readable without a contrasting background-image, for example.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About
© Webmaster World 1996-2014 all rights reserved