Recommended practice on selector compatibility

Hello,

I have a question on any guidelines or recommended practices on the issue
of selector compatibility between CSS1, CSS2 and CSS3 and HTML and XML.
Mainly, this is on the .name class selector of CSS1 and its equivalent,
[class=name] resp. [class~=name] in CSS2.

Situation:

- suppose you need to have class attribute values containing spaces or
any Unicode character
- suppose you need to create a stylesheet that works both with XML and HTML
- suppose you need to create a stylesheet that works in CSS1, CSS2 and CSS3

How does one best formulate the selector for a class named 'heading 1'?

Possibilities I have come up with:

(1) .heading\20 1 { ... }
(2) .heading\00201 { ... }
(3) .heading\0000201 { ... }
(4) *[class=heading\0000201] { ... }

ad 1:
The CSS validator <http://jigsaw.w3.org/css-validator/> issues an error
for this stating that the ~= selector may not contain a class name that
includes a space. However, I need to separate the '1' from the rest with
a space to not have it interpreted as belonging to the escape.

ad 2:
This validates, but will this work in CSS3 where the maximum escape
sequence has been extended to six hex characters? How do I tell a CSS3
parser that \0020 is a CSS2 conformant, maximum 4 char escape sequence
and the trailing '1' is the next literal character?

ad 3:
Opposite of (2), there is no way to make a CSS2 parser interpret the
escape correctly; it will stop after 4 chars and treat the rest as
literal again.

ad 4:
CSS1 does not support this kind of selector.


Also, the .classname shorthand seems only to be defined for HTML
documents (so I cannot use this notation for XML), whereas the XML
equivalent *[class=heading\0000201] is not usable in CSS1-supporting HTML
browsers (due to (4)).

What I have thought of would be something like

  .heading\00201, *[class=heading\0000201] { ... }

Is this correct CSS and, more specifically, is this a viable solution? In
connection with XML, the UA should disregard the .classname variant and
use the second simple selector, whereas in HTML, it would be the other
way round.

The above solution would still not solve the 4-char vs. 6-char maximum
length escape sequences problem. Or am I missing something?

Regards, Christian.

Received on Tuesday, 3 December 2002 16:57:54 UTC