View Single Post
  #2 (permalink)  
Old 08-28-2008, 02:09 AM
Harlan Messinger
Guest
 
Posts: n/a
Diggs:
Default Re: CSS classes rendered differently than in-line CSS

yawnmoth wrote:
> http://www.frostjedi.com/terra/scripts/demo/trtd.html
> http://www.frostjedi.com/terra/scripts/demo/trtd2.html
>
> Why don't those look the same in Firefox? The latter is the rendering
> I'd expect for the first one, as well. The only difference is that
> what's defined in-line in the second link is defined via a CSS class
> in the first.


Because a style set directly on an element has higher specificity than
stylesheet rules that match the element (in other words, the
directly-set style takes priority over the ".demo td" selector in the
inline stylesheet), while the ".demo td" selector has greater
specificity than the ".test" selector, the former consisting of a class
selector compounded with an element selector, while the latter consists
of only a class selector. See

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

for details. From there, you will see that the style attribute has
specificity 1,0,0,0, the ".demo td" selector has specificity 0,0,1,1,
and the ".test" selector has specificity 0,0,1,0.
Reply With Quote