Generated Content - 5 - First-* Pseudos

If you have any comments to make regarding this test, e-mail ian@hixie.ch.

Prerequisites

Browsers that are subjected to this test should support CSS1 and CSS2 generated content.

:first-letter

5.12.2 - Applicable Properties

These are the properties that apply to :first-letter pseudo-elements: font properties, color properties, background properties, 'text-decoration', 'vertical-align' (only if 'float' is 'none'), 'text-transform', 'line-height', margin properties, padding properties, border properties, 'float', 'text-shadow', and 'clear'.

This is not yet tested here.

5.12.2 - Punctuation

Punctuation (i.e, characters defined in Unicode in the "open" (Ps), "close" (Pe), and "other" (Po) punctuation classes), that precedes the first letter should be included.

This is not yet tested here.

5.12.3 - Combination with :before and :after

When the :first-letter and :first-line pseudo-elements are combined with :before and :after, they apply to the first letter or line of the element including the inserted text.

The following test line should collapse away to nothingness (it is an empty P):

Formatting

The :before and :after pseudo elements form part of the main element's content. Each of the following three sentences should be boxed by the single dotted box.

In the following case, there should be one outer dotted box containing three boxes, the top and bottom of which have dotted borders.

Special Content

There should be five distinct lines below, each labelled with the line number:

The markup below should be visible:

There should be no weird spacing in the next sentence:

Up to the Generated Content Tests.

Up to the Evil Tests Page.

This page is maintained by Ian Hickson (ian@hixie.ch).

Last updated in March 1999.