Section 6: Cascading and inheritance

Design notes

These tests follow the order of the specifications. The words Valid and Invalid mean that the relevant CSS will and won't validate, respectively. In the following tests, the red color indicates failure while the green color indicates that the test has been passed by the browser. The label Assertion explains the scope of the test.

Download

You can download all these tests in a single zip file.

Summary of tests
Name Title Flag Assertion
cascade0.html Cascade: Cascading order Valid Browsers should honour the cascading order
cascade1.html Cascading order: Imported stylesheet Valid Browsers should honour the cascading order
important0.html !important rules Valid Browsers should honour the !important statement
important1.html !important rules in imported stylesheets Valid Browsers should honour the !important statement
inheritance0.html Inherited property Valid Browsers should honour the inherited property
inheritance1.html Inherited values Valid Browsers should honour the inherited values
specificity0.html Specificity: Universal selector vs type selector Valid Browsers should give to each rule the correct specificity
specificity1.html Specificity: Type selector vs descendant selector Valid Browsers should give to each rule the correct specificity
specificity2.html Specificity: Universal selector Valid Browsers should give to each rule the correct specificity
specificity3.html Specificity: ID selector vs class selector Valid Browsers should give to each rule the correct specificity
specificity4.html Specificity: Type selector vs pseudo-element Valid Browsers should give to each rule the correct specificity
specificity5.html Specificity: Pseudo-class vs pseudo-element Valid Browsers should give to each rule the correct specificity
specificity6.html Specificity: Class, pseudo-element vs ID and pseudo-element Valid Browsers should give to each rule the correct specificity

Date: December 3, 2007