[thelist] CSS inheritance

Dmytro Borovsky thelist at web-artel.net
Sun Jun 23 03:51:00 CDT 2002


> I've defined a style called 'quote' with the color and font info I want.
> I've tried adding 'class="tag" ' to the <a> tag, a <div> around the entire
> link, the <p> the link lives in; nothing works. It picks up the italics of
> the 'quote' style, but ignores the color and background-color
> specifications.


<tip type="CSS Cascading Order Formula" author="Dmytro Borovsky">

Every selector has it's own specify; rulles with the same specify are
applied according to order of appereance.

Specify is counted as: (simplified formula; non-normative!)
(number of IDs in selector) * 10,000 + (number of classes and
pseudo-classes) * 100 + (number of element names)

Examples (according to non-normative formula):
 * (0 + 0 +0 = 0) (no IDs, no classes, no pseudo-classes, no elements)
a (0 + 0 + 1 = 1) (one element name)
a:hover (0 + 100 + 1 = 101) (one pseudo-class, one element)
body div#menu a.section:active () (10,000 + 200 + 3 = 10,203) (one ID, 2
classes/pseudo-classes, 3 elements)

</tip>

> a:link {}
Specify = 101

> .quote {}
Specify = 100

So you need to icrease specify of quote class:

a:link {}
Specify = 101


a.quote:link {}
Specify = 102

You see, more detailed selectors alway override more general ones.

Kind regards.
Dmytro Borovsky.




More information about the thelist mailing list