W3C CSS2 Cascading Style Sheets, level 2 - instructional media + ...

Start of outer contents.
Inner contents.
End of outer contents.
End of body contents.
In this document, we assume the following rules:
BODY { display: block; line-height: 200%;
width: 400px; height: 400px }
P { display: block }
SPAN { display: inline }
The final positions of boxes generated by the outer and inner elements vary in
each example. In each illustration, the numbers to the left of the illustration indicate
the normal flow [p. 105] position of the double-spaced (for clarity) lines.
(Note: the illustrations use different horizontal and vertical scales.)
9.8.1 Normal flow
Consider the following CSS declarations for outer and inner that don’t alter the
normal flow [p. 105] of boxes:
#outer { color: red }
#inner { color: blue }
The P element contains all inline content: anonymous inline text [p. 98] and
two SPAN element. Therefore, all of the content will be laid out in an inline
formatting context, within a containing block established by the P element,
producing something like:
116