- From: Oriol Brufau via GitHub <sysbot+gh@w3.org>
- Date: Wed, 20 Jan 2021 13:17:07 +0000
- To: public-css-archive@w3.org
Hacky, suboptimal performance and unreliable for big counter values, but I guess you could create a JS function which does this: 1. Creates a `::before` pseudo-element on the desired element, with `content: counter(the-counter, the-style)` 2. Uses a `@counter-style` to define `the-style` so that it produces: - For `n < 0`, a string with the character `0` repeated `-2*n - 1` times. - For `n = 0`, an empty string - For `n > 0`, a string with the character `0` repeated `2*n` times. 3. Uses a monospaced font to display that, and prevents line breaks, etc. 4. Retrieves the width of the string in pixels with `getComputedStyle`, and divides it by the amount of pixels in `1ch`. That's the number of characters `m`. 5. Maps `m` to the desired original `n`: `n = m % 2 ? -(m+1)/2 : m/2` 6. Restores the original state -- GitHub Notification of comment by Loirooriol Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/5879#issuecomment-763599583 using your GitHub account -- Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Wednesday, 20 January 2021 13:17:09 UTC