Line box height should not grow, should not stretch vertically to accommodate border and padding of non-replaced inline 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>
orange border is child, nested inline child of green border

Expected results (screenshot 964px wide):

CSS 1, Section 4.4 The height of lines says "any padding, border or margin above and below non-replaced inline elements does not influence the height of the line. In other words: if the 'line-height' is too small for the chosen padding or border, it will overlap with text on other lines."

CSS 2.1, Section 10.8.1 Leading and half-leading says "The height of the inline box encloses all glyphs and their half-leading on each side and is thus exactly 'line-height'. Boxes of child elements do not influence this height.

Although margins, borders, and padding of non-replaced elements do not enter into the line box calculation, they are still rendered around inline boxes. This means that if the height specified by 'line-height' is less than the content height of contained boxes, backgrounds and colors of padding and borders may 'bleed' into adjoining line boxes."