:before/:after and content

Not supported by IE7 and lower.

This is a test of the vital content declaration that combines with the :before and :after pseudo-classes.

Value IE 5.5 IE 6 IE 7 IE8b1 FF 2 FF 3b4 Saf 3.0 Win Saf 3.1 Win Opera 9.5b Konqueror 3.5.7
none
The :before pseudo-element is not generated.
No No Yes No No Yes

This is the test paragraph.

counter
Use a counter as value.
No Incorrect Incorrect Incorrect Yes Incorrect

This is the test paragraph.

Opera correctly shows the value 2. All other browsers incorrectly show 1, even though I clearly stated p.test {counter-increment: test;}; in other words: increase the counter every time a p.test is encountered.

attr()
Use an attribute value.
No Yes Yes Yes Yes Yes

This is the test paragraph.

string
Use a string value.
No Yes Yes Yes Yes Yes

This is the test paragraph.

URL
Use an image.
No Yes Yes Yes Yes

This is the test paragraph.

Value IE 5.5 IE 6 IE 7 IE8b1 FF 2 FF 3b4 Saf 3.0 Win Saf 3.1 Win Opera 9.5b Konqueror 3.5.7

Combining values

It's allowed to combine these values.

p.multi:before {
	content: "Test paragraph " counter(test) " " url(/pix/logo_ppk.gif) " with a class of " attr(class);
}

Test paragraph with all content values. The correct counter value is 6.