W3C home > Mailing lists > Public > www-style@w3.org > July 2000

Re: CSS precedence

From: Matthew Brealey <webmaster@richinstyle.com>
Date: Wed, 26 Jul 2000 10:56:17 +0100
Message-ID: <397EB5C1.596A@richinstyle.com>
To: fyodor checkov <suffolkuniversity@hotmail.com>
CC: www-style@w3.org
fyodor checkov wrote:
> 
> I recently took an exam, 

(Cool - a CSS exam :-)

> and while I got the question correct I was
> wondering if the test "givers" have things backwards.

More like they have things completely wrong.
 
> THE QUESTION
> What is the order of precedence between the types of styles (from lowest to
> highest)?
> 
> Answer:
> 
> 1) embedded, linked, inline
> 2) linked, inline, embedded
> 3) inline, embedded, linked
> 4) embedded, inline, linked

There is no such order of precedence. CSS has a cascade with the
following sections (in order, where if the first stage succeeds later
ones are not performed):

weight and origin 
specificity
'Finally, sort by order'
	
(this is defined in
http://www.w3.org/TR/REC-CSS2/cascade.html#cascading-order)

The difference between embedded and linked styles is one of order, and
as such specificity sorting will be performed first. This means that the
question is ambiguous: in general 

P.class
vs .class
 
order is irrelevant; the qualifier of equal specificity (identical
origin is implied) is required.

More fundamentally, howevever, there is no rule regarding embedded vs.
linked order:

<style>
</style>
<link rel=stylesheet ....

has linked after embedded whereas:

<link rel=stylesheet ....
<style>
</style>

has the reverse

Finally, inline styles are a separate case, since they are (sadly - see
previous posts) resolved according to a specificity sort with
specificity of 100, and therefore whether more specific than
inline/embedded depends wholly on the specificity of the compared
selector.

(PS. If they want someone to write questions on CSS for them, I would be
willing to oblige for a modest fee.)

-----------------------------------
Please visit http://RichInStyle.com. Featuring:
MySite: customizable styles.         AlwaysWork style 
Browser bug table covering all CSS2 with links to descriptions.
Lists of > 1000 browser bugs         Websafe Colorizer 
CSS2, CSS1 and HTML4 tutorials.      CSS masterclass 
CSS2 test suite: 5000++ tests and 300+ test pages.
Received on Wednesday, 26 July 2000 05:56:57 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Monday, 27 April 2009 13:54:05 GMT