Closed
Description
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;
}
<ol type="a">
<li>foo</li>
<li>bar</li>
<li>baz</li>
</ol>
<ol type="A">
<li>foo</li>
<li>bar</li>
<li>baz</li>
</ol>
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