Let’s Use the Nonexistent ::nth-letter Selector Now

This article discusses the long-awaited CSS ::nth-letter pseudo-element selector that doesn't exist yet and how it could be implemented as a polyfill.

• •The ::nth-letter selector has been requested since 2003, similar to existing ::first-letter for creating stylized typography effects
• •Demonstrates use cases where ::nth-letter would eliminate JavaScript, such as text vortex scrolling and direction-aware hover effects
• •Explores implementation challenges including how to define "nth" with respect to DOM structure and writing directions
• •Clarifies that a reliable CSS polyfill is theoretically impossible, but a "shim" can provide practical functionality
• •Provides a 29-line JavaScript implementation using regular expressions to rewrite CSS and transform DOM elements