Inline box height should not grow, should not stretch vertically to fit nested inline child elements

Actual (live) results in your browser:

This is the first inline element and this the second inline element, nested inside the first one.

This is an inline element with an image inside of it.

There are no anonymous inline boxes within the above 2 <p>.
blue border is block-level <p>
green border is a <span>, first child of parent <p>
red border is child, nested inline child of green border

Expected results (screenshot 964px wide):

CSS 2.1, Section 10.6.1 (Visual Formatting model details, Calculating Height for Inline, non-replaced elements) says "The height of the content area [of inline, non-replaced elements] should be based on the font" and not vertically stretched, grown because of inline children.