Position: relative; top: 50%;

Expected results: There should be a 400px wide by 200px high <div> with a red background right under, immediately below this sentence.

This background red block is a relatively positioned <div>. The CSS code applying to it is

position: relative; top: 50%;

and its nearest block-level ancestor box is the <body> node and its height is auto.

Filing

Expected results: when the height of the containing block of a relatively positioned element is auto, then top: <percentage>; must be resolved as top: auto;.

References:

"Percentages: refer to height of containing block" CSS 2.1, Section 9.3.2 Box offsets: 'top', 'right', 'bottom', 'left'
Percentage values for the 'top' property are relative to the containing block.
"if the element's position is 'relative' or 'static', the containing block is formed by the content edge of the nearest block-level, table cell or inline-block ancestor box." coming from CSS 2.1, Section 10.1 Definition of "containing block"
"If the height of the containing block is not specified explicitly (i.e., it depends on content height), and this element is not absolutely positioned, [then] the [height] value computes to 'auto'." CSS 2.1, Section 10.5 Content height: the 'height' property