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 | Incor |
Incor |
Incor |
Yes | Incor |
||||
|
This is the test paragraph. Opera correctly shows the value 2. All other browsers incorrectly show 1, even though I clearly
stated |
||||||||||
|
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 |
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.