font attributes inheritance question

I don't understand the inheritance logic in this situation.
Let me describe a simple situation: I have a document with a style
sheet that specifies:

address, blockquote, caption, center, dd, dir, div, dl, dt,
form, hr, menu, ol, p, td, th, ul {
font-size: 100%;
}
body {
font: 100% serif, "Times New Roman","Times Roman";
...
}
.title {
font-style: italic;
}

In the body, I have this:

<h2>Some text<span class="title">A title</span>...

The "A title" text is sanserif and larger than "Some test". Why?

--
Haines Brown
brownh (AT) hartford-hwp (DOT) com
kb1grm (AT) arrl (DOT) net
www.hartford-hwp.com

Haines Brown <brownh (AT) teufel (DOT) hartford-hwp.com> wrote:

I don't understand the inheritance logic in this situation.

First, please note that in CSS we have properties. Many of them
correspond to HTML attributes, but they are still separate concepts.
(Unfortunately Microsoft calls CSS properties "attributes" in IE
documentation.)

Second, the main source of confusion is that people miss this
principle: inheritance always comes last, no matter what. _Any_ setting
of a property for an element implies that the element never inherits
that property.

address, blockquote, caption, center, dd, dir, div, dl, dt,
form, hr, menu, ol, p, td, th, ul {
font-size: 100%;
}

That's formally correct, but rather pointless and might in vain defeat
a user style sheet setting (which e.g. tries to make captions appear in
larger font or address elements in smaller font).

body {
font: 100% serif, "Times New Roman","Times Roman";
...
}

Rather pointless too. Any conforming implementation needs to have a
generic serif font if it uses different fonts at all, so anything you
list after serif is irrelevant.

.title {
font-style: italic;
}

OK, but are you sure a class is best markup? It sounds you might need
the cite element.

In the body, I have this:

h2>Some text<span class="title">A title</span>...

The "A title" text is sanserif and larger than "Some test". Why?

It's either a browser bug, or something in your markup or style sheet
that causes that. You need to specify the URL and the browser(s) used
for an analysis.

Given the extracts of HTML and CSS posted, and assuming that there
is no other style sheet in action and the h2 element is a child of
body, the span element inherits font-family and font-size from h2,
which inherits them from body. In practice, there's most probably at
least a browser default style sheet participating in the game,
assigning some font-size property at least to h2, so this value is used
instead of inheriting a value from body.

But I'm about 100% sure there's something involved that was not
disclosed.

--
Yucca, http://www.cs.tut.fi/~jkorpela/

When exploring this issue, I found that I had a problem with my
browser. I apologize for the misdirection.
--
Haines Brown
brownh (AT) hartford-hwp (DOT) com
kb1grm (AT) arrl (DOT) net
www.hartford-hwp.com