[selectors-4] Case-sensitive attribute selectors · Issue #2101 · w3c/csswg-drafts (original) (raw)

The Selectors spec says:

By default case-sensitivity of attribute names and values in selectors depends on the document language. To match attribute values case-insensitively regardless of document language rules, the attribute selector may include the identifier i before the closing bracket (]).

Could there be a similar flag for case-sensitive matching?

I needed to select <ol> with type=a or type=A and apply different styles to them.

@counter-style list-a { system: extends lower-alpha; suffix: ') '; }

@counter-style list-A { system: extends upper-alpha; suffix: ') '; }

ol[type=a] { list-style: list-a; }

ol[type=A] { list-style: list-A; }

1. foo
2. bar
3. baz

1. foo
2. bar
3. baz

The desirable result is:

a) foo
b) bar
c) baz

A) foo
B) bar
C) baz

But this doesn’t work because browsers match type attributes case-insensitively, so the second style rule overwrites the first one.

Thus the actual result is:

A) foo
B) bar
C) baz

A) foo
B) bar
C) baz