(1)

The first line in this paragraph should be smaller than the next since 'font-size' has been set to '60%'.

(2)

The first letter in this paragraph has a font-size of 3em and since it's floating it should be "dropped" into the paragraph.

(3)

When spanning an inline element with a positive letter-spacing, I believe the background should not extend outside the left-most and right-most letters. So, in the example below, the red background shouldn't extend to the right of the letter "m". Otherwise, the result looks imbalanced. Padding can be used to extend the rectangle, if necessary.

forum

(4)

Borders and padding set on inline area do not contribute to the calculation of line boxes. A border set on an inline element should therefore not influence the position of a border set on a block-level element. In the two examples below, the block that contains the words have been given a red top border. The second word ("bar") also has a green dotted border set on an inline element. The green border should overlap the red one and the distance between the words and their red border should be the same in both examples.

foo

bar

(5)

What should a wide dotted border look like? A zebra crossing (i.e., as the width of the border increases, the width of the dots remain constant) or a set of square bricks (i.e., the dots are always square). Personally, I think I prefer the zebra crossing version but the spec is silent on this.

(6)

This text should have a green 100px border on the left side of the first line and a red border underneath the whole text. The green border should not indent the other lines.

(7)

All of this text should have a red underlining but the underlining should not extend beyond the text.

(8)

The first letter in this paragraph should be green, the rest should be blue

(9)

this paragraph contains only lowercase text, but the text is capitalized and set to small-caps; although the specification isn't clear on this, it is suggested that the capitalization is performed before the generation of small-caps so that the first letter of each word appear larger than the rest of the letters.

(10)

In the set of boxes below, the colors of the border should be blue, green, red, and black. The innermost text should be black. There should be a 10px margin between each border, both horizontally and vertically.

There should be a 10% margin around the BODY element. Also, there should be a 10px padding around the BODY element. This makes it possible to create simple "expressions".

(11)

The behavior of HR should be coordinated more closely. Here's a quick description of what appears to be the current implementation.

• IE treats it as a border wrt. color, but uses the 'height' property to control its size. 'width' and 'text-align' are honored.
• nglayout honors 'width' and 'text-align' only.
• opera treats it as if is was a real border (but top and bottom seems to be mixed up. width/text-align are not honored

(12)

When the 'width' of a floating element is set to be very small, the UA can enlarge it to a reasonable value.

When the 'width' is set to be very small, the UA can enlarge it to a reasonable value.