[csswg-drafts] [selectors-4] Case-sensitive attribute selectors

valtlai has just created a new issue for https://github.com/w3c/csswg-drafts:

== [selectors-4] Case-sensitive attribute selectors ==
The spec [says](https://drafts.csswg.org/selectors-4/#case-sensitive):
> 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 (`]`).

Would there be similar flag for case-sensitive matching?

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

CSS:
```css
@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;
}
```

HTML:
```html
<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>
```

Result:
```
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.

So the result is:

```
A) foo
B) bar
C) baz

A) foo
B) bar
C) baz
```

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/2101 using your GitHub account

Received on Sunday, 10 December 2017 21:27:34 UTC