CSS Priority
 

Hello,

If you have a style sheet that is linked from an HTML document AND you have a
duplicate style sheet actually on the page, meaning some names are the same but
parameters are different, which takes priority (which does the browsers look
too for instruction)?

Does this change in different browsers/platforms?

Thanks,
Tim

Re: CSS Priority
 

eyebuzz@aol.com (EYEBUZZ) wrote:

>If you have a style sheet that is linked from an HTML document AND you have a
>duplicate style sheet actually on the page, meaning some names are the same but
>parameters are different, which takes priority (which does the browsers look
>too for instruction)?

http://www.w3.org/TR/CSS2/cascade.html#cascade

--
Spartanicus

Re: CSS Priority
 

EYEBUZZ wrote:

> Hello,
>
> If you have a style sheet that is linked from an HTML document AND you have a
> duplicate style sheet actually on the page, meaning some names are the same but
> parameters are different, which takes priority (which does the browsers look
> too for instruction)?
>
> Does this change in different browsers/platforms?

The last style defined always takes precedence, unless the !important
keyword is used, which just complicated issues :)

The general order is something like:

External author's CSS - ie. <link... />
Internal CSS - ie. within <style...></style>
Inline styles - ie. <span style="..."></span>
The user's own stylesheet

HTH

--
Dylan Parry
http://www.webpageworkshop.co.uk - FREE Web tutorials and references

Re: CSS Priority
 

Dylan Parry wrote:
> The last style defined always takes precedence, unless the !important
> keyword is used, which just complicated issues :)

Nonsense. A stylesheet can have this:

#bar {
color : red;
}
..foo {
color : blue;
}

And this will be red, even though blue was defined after red:

<div class="foo" id="bar">Red or blue, Neo?</div>

Re: CSS Priority
 

Leif K-Brooks wrote:

> Dylan Parry wrote:
>> The last style defined always takes precedence, unless the !important
>> keyword is used, which just complicated issues :)
>
> Nonsense. A stylesheet can have this:
>
> #bar {
> color : red;
> }
> .foo {
> color : blue;
> }
>
> And this will be red, even though blue was defined after red:
>
> <div class="foo" id="bar">Red or blue, Neo?</div>

If you read the OP and my reply you will see that I was not referring to
styles defined within the one sheet or to the complication of using a
class and an id in the same element, but to the general overview - the
last style being defined is the user's stylesheet, which takes precedence.

--
Dylan Parry
http://www.webpageworkshop.co.uk - FREE Web tutorials and references
Now playing: Yes - Give Love Each Day from "Magnification"