CSS2.1 Test Suite

Assigning property values, Cascading, and Inheritance (118 tests)

Test Flags Info
+ 6 Assigning property values, Cascading, and Inheritance
at-import-001 @import not as the first declaration
  • An @import is ignored if it is not the first statement in a style block.
at-import-002 Importing external stylesheets with @import
  • An @import used to import external stylesheets.
at-import-003 Importing styles using @import with a string
  • An @import used with just a string is interpreted as if it had url(...) around it.
at-import-004 Media dependency on @import set to 'print'
  • Specifying a media-dependency of print does not apply rules to the user agent display.
at-import-005 Media dependency on @import set to 'all'
  • Specifying the media-dependency of 'all' applies to all media types including user agent display.
at-import-006 Media dependency on @import set to 'screen'
  • Specifying the media-dependent import rules to 'screen' applies to user agent display.
at-import-007 @import with @charset
  • An @import is valid after @charset.
default-stylesheet-001 A Overriding the default style sheet
  • Default style sheet settings can be overridden.
html-attribute-001 Attribute 'align' vs. CSS 'text-align' specificity
  • Attribute 'align' has a specificity of zero and is overridden by CSS.
html-attribute-002 U Attribute 'alink' vs. CSS active specificity
  • Attribute 'alink' has a specificity of zero and is overridden by CSS.
html-attribute-004 Attribute 'bgcolor' vs. CSS 'background-color' specificity
  • Attribute 'bgcolor' has a specificity of zero and is overridden by CSS.
html-attribute-005 Attribute 'border' vs. CSS border specificity
  • Attribute 'border' has 0 specificity and is overridden by CSS.
html-attribute-006 Attribute 'cellpadding' vs. CSS 'padding' specificity
  • Attribute 'cellpadding' has a specificity of zero and is overridden by CSS.
html-attribute-007 Attribute 'cellspacing' vs. CSS border-spacing specificity
  • Attribute 'cellspacing' has 0 specificity and is overridden by CSS.
html-attribute-008 Attribute 'clear' vs. CSS 'clear' specificity
  • Attribute 'clear' has a specificity of zero and is overridden by CSS.
html-attribute-009 Attribute 'color' vs. CSS 'color' specificity
  • Attribute 'color' has a specificity of zero and is overridden by CSS.
html-attribute-010 Attribute 'cols' vs CSS 'width' specificity
  • Attribute 'cols' has a specificity of zero and is overridden by CSS.
html-attribute-011 Attribute 'width' vs. CSS 'width' specificity
  • Attribute 'width' has a specificity of zero and is overridden by CSS.
html-attribute-012 A Attribute 'face' vs. CSS 'font-family' specificity
  • Attribute 'face' has a specificity of zero and is overridden by CSS.
html-attribute-013 Attribute 'valign' vs. CSS 'vertical-align' specificity
  • Attribute 'valign' has a specificity of zero and is overridden by CSS.
html-attribute-014 Attribute 'frame' vs. CSS 'border' specificity
  • Attribute 'frame' has a specificity of zero and is overridden by CSS.
html-attribute-015 Attribute 'rules' vs. CSS border specificity
  • Attribute 'rules' has a specificity of zero and is overridden by CSS.
html-attribute-017 Attribute 'height' vs. CSS 'height' specificity
  • Attribute 'height' has a specificity of zero and is overridden by CSS.
html-attribute-018 G Attribute 'hspace' vs. CSS 'margin' specificity
  • Attribute 'hspace' has a specificity of zero and is overridden by CSS.
html-attribute-019 G Attribute 'vspace' vs. CSS 'margin' specificity
  • Attribute 'vspace' has a specificity of zero and is overridden by CSS.
html-attribute-020 Attribute 'link' vs. CSS ':link' specificity
  • Attribute 'link' has a specificity of zero and is overridden by CSS.
html-attribute-021 Attribute 'marginheight' vs. CSS 'margin' specificity
  • Attribute 'marginheight' has a specificity of zero and is overridden by CSS.
html-attribute-022 Attribute 'marginwidth' vs. CSS 'margin' specificity
  • Attribute 'marginwidth' has a specificity of zero and is overridden by CSS.
html-attribute-023 HTML 'noshade' attribute vs CSS color specificity
  • HTML attribute has 0 specificity and is overridden by CSS (noshade).
html-attribute-024 Attribute 'nowrap' vs. CSS 'white-space' specificity
  • Attribute 'nowrap' has a specificity of zero and is overridden by CSS.
html-attribute-025 Attribute 'rows' vs CSS 'height' specificity
  • Attribute 'rows' has a specificity of zero and is overridden by CSS.
html-attribute-027 Attribute 'size' vs CSS 'height' specificity
  • Attribute 'size' has a specificity of zero and is overridden by CSS.
html-attribute-028 Attribute 'text' vs. CSS 'color' specificity
  • Attribute 'text' has a specificity of zero and is overridden by CSS.
html-attribute-029 Attribute 'vlink' vs. CSS ':visited' specificity
  • Attribute 'vlink' has a specificity of zero and is overridden by CSS.
html-precedence-001 Element selector precedence
  • The element selector takes precedence over the font element 'color' attribute.
html-precedence-002 Universal selector precedence
  • The universal selector and the 'color' attribute have the same specificity. The universal selector is applied since CSS takes precedence.
html-precedence-003 User style sheet precedence
  • The 'font' element's 'color' attribute trumps the user stylesheet's universal selector. They have the same specificity but the font element is a virtual author rule.
inherited-value-001 Inheritance
  • Children elements can inherit properties from parents.
inherited-value-002 A Inheriting computed values
  • The computed value of a font-size with a percentage is the percentage of its parent's font-size value. A nested element which also has a percentage applies the parents' specified value (which is inherited).
non-inherited-value-001 Non-inherited values
  • If the cascade results in a value, use it.
specificity-001 Calculating specificity - Specificity 0010 vs. 0001
  • The element selector has the highest specificity - specificity 0010 takes precedence over 0001.
specificity-002 Calculating specificity - Inline Style
  • Specificity of the inline style trumps all other selectors.
specificity-003 Calculating specificity - Specificity 0100 vs. 0011
  • The element selector has the highest specificity - specificity 0100 takes precedence over 0011.
specificity-004 Calculating specificity - Specificity 0011 vs. 0010
  • The element selector has the highest specificity - specificity 0011 takes precedence over 0010.
specificity-005 Calculating specificity - Specificity 0002 vs. 0001
  • First-line selector with highest specificity wins - specificity 0002 takes precedence over 0001.
specificity-006 Calculating specificity - Pseudo-element vs. simple element
  • The pseudo-element 'first-line' takes precedence over simple element selector.
specificity-007 Calculating specificity - Specificity 0001 vs. 0000
  • The element selector has the highest specificity - specificity 0001 takes precedence over 0000.
specificity-008 Calculating specificity - specificity 0003 vs. 0001
  • First-line selector with highest specificity wins - specificity 0003 takes precedence over 0001.
specificity-009 Calculating specificity - specificity 0003 vs. 0002
  • First-line selector with highest specificity wins - specificity 0003 take precedence over 0002.
user-stylesheet-001 User defined stylesheet can be applied
  • User stylesheet can be applied to the page.
user-stylesheet-002 User defined stylesheet can be applied and persisted
  • The user stylesheet is still applied after close and reopen the user agent window.
user-stylesheet-003 User defined stylesheet cannot override property defined in style tag
  • The user style sheet cannot override property defined in style tag.
user-stylesheet-004 User defined stylesheet cannot override inline style
  • The user style sheet cannot override property defined in inline style attribute.
user-stylesheet-005 Descendant selector defined in user stylesheet can be applied
  • The descendant selector defined in user stylesheet is applied to the appropriate element.
user-stylesheet-006 Child selector defined in user stylesheet can be applied
  • The child selector defined in user stylesheet is applied to the appropriate element.
user-stylesheet-007 Adjacent sibling selector defined in user stylesheet can be applied
  • The adjacent sibling selector defined in user stylesheet is applied to the appropriate element.
user-stylesheet-008 Attribute selector defined in user stylesheet can be applied
  • The attribute selector defined in user stylesheet is applied to the appropriate element.
user-stylesheet-009 ID selector defined in user stylesheet can be applied
  • The ID selector defined in user stylesheet is applied to the appropriate element.
user-stylesheet-010 Pseudo-class selector :first-child defined in user stylesheet can be applied
  • The pseudo-class selector :first-child defined in user stylesheet is applied to the first child of an element.
user-stylesheet-011 Pseudo-element first-line selector defined in user stylesheet can be applied
  • The pseudo-element selector :first-line defined in user stylesheet is applied to the first line of an element.
user-stylesheet-012 Link defined in user stylesheet can be applied
  • The pseudo-class selector :link defined in user stylesheet is applied to all links.
user-stylesheet-013 U Visited selector defined in user stylesheet can be applied
  • The pseudo-class selector :visited defined in user stylesheet is applied when a link has already been visited.
user-stylesheet-014 U Hover defined in user stylesheet can be applied
  • The pseudo-class selector :hover defined in user stylesheet is applied when the mouse is above an element.
user-stylesheet-015 U Pseudo-class :active defined in user stylesheet can be applied
  • The pseudo-class selector :active defined in user stylesheet is implemented.
user-stylesheet-016 Pseudo-element first-letter selector defined in user stylesheet can be applied
  • The pseudo-element selector :first-letter defined in user stylesheet is applied to the first letter of an element.
user-stylesheet-017 Pseudo-element before selector defined in user stylesheet can be applied
  • The pseudo-element selector :before defined in user stylesheet is inserted before an element.
user-stylesheet-018 Pseudo-element after selector defined in user stylesheet can be applied
  • The pseudo-element selector :after defined in user stylesheet is inserted after an element.
+ 6.1 Specified, computed, and actual values
+ 6.1.1 Specified values
cascade-precedence-001 cascades, inheritance and table-cell horizontal alignment
  • When determining the specified value of a property, the cascade mechanism of (user agent, author, user) style sheets has precedence. If no value results from such mechanism, then the property may inherit from its parent. In this testcase, it is presumed that table cell headers are specified to be aligned in the center in user agents style sheets. Center is the default horizontal alignment value for table header cells.
cascade-precedence-002 cascades, inheritance and table-cell horizontal alignment
  • When determining the specified value of a property, the cascade mechanism of (user agent, author, user) style sheets has precedence. If no value results from such mechanism, then the property may inherit from its parent. In this testcase, it is presumed that table cell headers are specified to be aligned in the center in user agents style sheets. Center is the default horizontal alignment value for table header cells.
cascade-precedence-003 cascades, inheritance and table-cell horizontal alignment
  • When determining the specified value of a property, the cascade mechanism of (user agent, author, user) style sheets has precedence. If no value results from such mechanism, then the property may inherit from its parent. In this testcase, it is presumed that table cell headers are specified to be aligned in the center in user agents style sheets. Center is the default horizontal alignment value for table header cells.
cascade-precedence-004 cascades, inheritance and table-cell horizontal alignment
  • When determining the specified value of a property, the cascade mechanism of (user agent, author, user) style sheets has precedence. If no value results from such mechanism, then the property may inherit from its parent. In this testcase, it is presumed that table cell headers are specified to be aligned in the center in user agents style sheets. Center is the default horizontal alignment value for table header cells.
cascade-precedence-005 cascades, inheritance and table-cell horizontal alignment
  • When determining the specified value of a property, the cascade mechanism of (user agent, author, user) style sheets has precedence. If no value results from such mechanism, then the property may inherit from its parent. In this testcase, it is presumed that table cell headers are specified to be aligned in the center in user agents style sheets. Center is the default horizontal alignment value for table header cells.
cascade-precedence-006 cascades, inheritance and table-cell horizontal alignment
  • When determining the specified value of a property, the cascade mechanism of (user agent, author, user) style sheets has precedence. If no value results from such mechanism, then the property may inherit from its parent. In this testcase, it is presumed that table cell headers are specified to be aligned in the center in user agents style sheets. Center is the default horizontal alignment value for table header cells.
cascade-precedence-007 cascades, inheritance and table-cell horizontal alignment
  • When determining the specified value of a property, the cascade mechanism of (user agent, author, user) style sheets has precedence. If no value results from such mechanism, then the property may inherit from its parent. In this testcase, it is presumed that table cell headers are specified to be aligned in the center in user agents style sheets. Center is the default horizontal alignment value for table header cells.
list-style-019 G list-style - initial value
  • 'list-style' property is a shorthand notation that sets the three properties 'list-style-type', 'list-style-image' and 'list-style-position'. If one of the 3 list-style properties is not specified explicitly, then such 'list-style' property is assigned its initial value as indicated in its property definition.
+ 6.1.2 Computed values
+ 6.1.3 Used values
+ 6.1.4 Actual values
+ 6.2 Inheritance
c13-inh-underlin-000 Inheritance
c13-inheritance-000 Inheritance
c548-ln-ht-003 AG line-height
c548-ln-ht-004 AG line-height
cascade-precedence-001 cascades, inheritance and table-cell horizontal alignment
  • When determining the specified value of a property, the cascade mechanism of (user agent, author, user) style sheets has precedence. If no value results from such mechanism, then the property may inherit from its parent. In this testcase, it is presumed that table cell headers are specified to be aligned in the center in user agents style sheets. Center is the default horizontal alignment value for table header cells.
cascade-precedence-002 cascades, inheritance and table-cell horizontal alignment
  • When determining the specified value of a property, the cascade mechanism of (user agent, author, user) style sheets has precedence. If no value results from such mechanism, then the property may inherit from its parent. In this testcase, it is presumed that table cell headers are specified to be aligned in the center in user agents style sheets. Center is the default horizontal alignment value for table header cells.
cascade-precedence-003 cascades, inheritance and table-cell horizontal alignment
  • When determining the specified value of a property, the cascade mechanism of (user agent, author, user) style sheets has precedence. If no value results from such mechanism, then the property may inherit from its parent. In this testcase, it is presumed that table cell headers are specified to be aligned in the center in user agents style sheets. Center is the default horizontal alignment value for table header cells.
cascade-precedence-004 cascades, inheritance and table-cell horizontal alignment
  • When determining the specified value of a property, the cascade mechanism of (user agent, author, user) style sheets has precedence. If no value results from such mechanism, then the property may inherit from its parent. In this testcase, it is presumed that table cell headers are specified to be aligned in the center in user agents style sheets. Center is the default horizontal alignment value for table header cells.
cascade-precedence-005 cascades, inheritance and table-cell horizontal alignment
  • When determining the specified value of a property, the cascade mechanism of (user agent, author, user) style sheets has precedence. If no value results from such mechanism, then the property may inherit from its parent. In this testcase, it is presumed that table cell headers are specified to be aligned in the center in user agents style sheets. Center is the default horizontal alignment value for table header cells.
cascade-precedence-006 cascades, inheritance and table-cell horizontal alignment
  • When determining the specified value of a property, the cascade mechanism of (user agent, author, user) style sheets has precedence. If no value results from such mechanism, then the property may inherit from its parent. In this testcase, it is presumed that table cell headers are specified to be aligned in the center in user agents style sheets. Center is the default horizontal alignment value for table header cells.
cascade-precedence-007 cascades, inheritance and table-cell horizontal alignment
  • When determining the specified value of a property, the cascade mechanism of (user agent, author, user) style sheets has precedence. If no value results from such mechanism, then the property may inherit from its parent. In this testcase, it is presumed that table cell headers are specified to be aligned in the center in user agents style sheets. Center is the default horizontal alignment value for table header cells.
inherit-border-padding-000 Explicit Inheritance
+ 6.2.1 The 'inherit' value
dynamic-top-change-001 O Inheriting 'top' changes from relpos grandparent
  • The position of a positioned element which inherits its 'top' value from its relatively positioned grandparent changes when the grandparent's 'top' value is changed.
dynamic-top-change-002 O Inheriting 'top' changes from parent table-row through anonymous table boxes
  • The position of a positioned element which inherits its 'top' value from its parent changes when the parent's 'top' value is changed even if the parent is display:table-row.
dynamic-top-change-003 O Inheriting 'top' changes from parent table through anonymous table boxes
  • The position of a positioned element which inherits its 'top' value from its parent changes when the parent's 'top' value is changed even if the parent is display:table.
dynamic-top-change-004 O Inheriting 'top' changes from abspos parent
  • The position of a positioned element which inherits its 'top' value from its parent changes when the parent's 'top' value is changed.
dynamic-top-change-005 O Inheriting 'top' changes from abspos grandparent
  • The position of a positioned element which inherits its 'top' value from its absolutely positioned grandparent changes when the grandparent's 'top' value is changed.
html-attribute-003 G Attribute 'background' vs. CSS 'background' specificity
  • Attribute 'background' has a specificity of zero and is overridden by CSS.
inherit-001 Inherit keyword
  • Children elements inherit the parents color given the 'inherit' keyword.
inherit-002 Inherit on non-inherited properties
  • Inherit can be used on properties which are not normally inherited.
inherit-003 Inherit on the root element
  • If the 'inherit' value is set on the root element, the property is assigned its initial value.
+ 6.3 The @import rule
at-import-008 P @import
  • Media-dependent @import rules
c11-import-000 Basic Containment
c64-uri-000 G URLs
+ 6.4 The cascade
c21-pseu-cls-000 U anchor
c21-pseu-id-000 U anchor
cascade-001 User style sheets
  • Normal user declarations override the default user agent style sheet.
cascade-002 Author stylesheets override user stylesheets
  • Normal author declarations override normal user stylesheet declarations.
cascade-003 Author rules with !important and a user stylesheet
  • Author rules using !important override user stylesheet rules.
cascade-004 User stylesheet rules using !important and normal author rules
  • User stylesheet rules using !important override normal author rules.
cascade-005 Redefining rules
  • The latter specified rule wins when having the same specificity and weight.
cascade-006 User style sheets and redefining rules
  • The latter specified rule wins when having the same specificity and weight in user styles sheets.
cascade-007 Author rules local and external
  • Author rules in embedded stylesheets override author rules in imported stylesheets.
cascade-008 Shorthand properties with !important
  • Shorthand properties with !important apply to all direct sub-properties.
cascade-009 Author rules with !important and other normal author rules
  • Author rules with !important override normal author rules.
cascade-010 User stylesheet rules with !important and !important author rules
  • User stylesheet rules with !important override !important author rules.
cascade-011 User stylesheet rules with !important and normal user rules
  • User stylesheet rules with !important override normal user rules.
+ 6.4.1 Cascading order
c31-important-000 important
c32-cascading-000 Cascading Order
+ 6.4.2 !important rules
c31-important-000 important
+ 6.4.3 Calculating a selector's specificity
c21-pseu-cls-000 U anchor
c21-pseu-id-000 U anchor
c32-cascading-000 Cascading Order
+ 6.4.4 Precedence of non-CSS presentational hints