CSS Selectors 4 <https://drafts.csswg.org/selectors-4/#pseudo-element-syntax> clearly states: > Pseudo-element names are ASCII case-insensitive. CSS Selectors 4 is currently an Editor's Draft. But CSS 2.1 <https://www.w3.org/TR/CSS21/selector.html#pseudo-elements> also clearly states: > Pseudo-element and pseudo-class names are case-insensitive. Nevertheless, the following code does not have the expected effect: <!DOCTYPE html> <style> body::before { content: "Failure!" } body::BEFORE { content: "Success!" } </style> (As a data: URI for quick testing: data:text/html,<!DOCTYPE html><style>body::before{content:"Failure!"}body::BEFORE{content:"Success!"}</style> ) Related to Bug 81752, but I'm filing this separately since that bug seems focused on selectors determined by the host language (e.g., attribute selectors), and not selectors defined by CSS.
I turned the test case from Comment 0 into JSFiddle: Link - https://jsfiddle.net/fwzd8cu6/show I am able to reproduce this bug in Safari 15.6.1 and Safari Technology Preview 151 using above and it shows "FAILURE" while in case of other browsers (Chrome Canary 106 and Firefox Nightly 105) show "SUCCESS". Thanks!
Pull request: https://github.com/WebKit/WebKit/pull/3511
Committed 253631@main (2f1268f7d8b2): <https://commits.webkit.org/253631@main> Reviewed commits have been landed. Closing PR #3511 and removing active labels.
<rdar://problem/98950003>