- From: Christoph Päper <christoph.paeper@tu-clausthal.de>
- Date: Tue, 16 Mar 2004 19:49:03 +0100
- To: <www-style@w3.org>
- Cc: "Alan Plum" <ashmodai@mushroom-cloud.com>
*Alan Plum*:
>
> Especially with browsers which for some reason do not understand how to
> handle elements with multiple classes in HTML, some people wish there
> was a way to have some kind of wildcard in an ID or class selector.
I fail to see how this two issues connect.
Some new additions to CSS don't help with bugs or non-implementations in
existing browsers.
> *[class=regexp(/myclass-(a|b)[0-9]+/)] {/* ... */}
You'd probably better take the usual CSS approach and put some (ASCII,
non-letter) character in front of the equals sign to designate a RegEx
following, e.g.
*[class@="/myclass-(a|b)[0-9]+/"] {/* ... */}
*[class%="/myclass-(a|b)[0-9]+/"] {/* ... */}
*[class§="/myclass-(a|b)[0-9]+/"] {/* ... */}
*[class/="myclass-(a|b)[0-9]+"] {/* ... */}
CSS3 Selectors already covers the most general cases with '*=' (contains),
'^=' (starts with) and '$=' (ends with).
*[class|="myclass"] {/* ... */}
and even more
*[class^="myclass-a"], *[class^="myclass-b"] {/* ... */}
come already close to what you want to achieve.
> For now a wildcard character would be enough, eg:
>
> *[class=myclass-a~5] {/* ... */}
Who says the tilde wasn't allowed in the attribute's content?
I think the better approach is to require the match of two attribute selectors
like so:
*[class^="myclass-a"][class$="5"] {/* ... */}
That should work just fine with CSS3 Selectors (and therefore in Gecko based
browsers). At least I don't recall a restriction that each attribute selector
must be using a different attribute. That said, you could extend the selectors
from above:
*[class^="myclass-a"][class$="0"], *[class^="myclass-b"][class$="0"],
*[class^="myclass-a"][class$="1"], *[class^="myclass-b"][class$="1"],
*[class^="myclass-a"][class$="2"], *[class^="myclass-b"][class$="2"],
*[class^="myclass-a"][class$="3"], *[class^="myclass-b"][class$="3"],
*[class^="myclass-a"][class$="4"], *[class^="myclass-b"][class$="4"],
*[class^="myclass-a"][class$="5"], *[class^="myclass-b"][class$="5"],
*[class^="myclass-a"][class$="6"], *[class^="myclass-b"][class$="6"],
*[class^="myclass-a"][class$="7"], *[class^="myclass-b"][class$="7"],
*[class^="myclass-a"][class$="8"], *[class^="myclass-b"][class$="8"],
*[class^="myclass-a"][class$="9"], *[class^="myclass-b"][class$="9"]
{ /* ... */ }
Still not the same, though, and quite lengthy.
Received on Tuesday, 16 March 2004 13:52:17 UTC