Re: [css-lists] Allow counter() to be used where numeric values are expected

On Fri, Mar 4, 2016 at 11:30 PM, Mark Crutch <mark.crutch@gmail.com> wrote:
> On 4 March 2016 at 20:11, Tab Atkins Jr. <jackalmage@gmail.com> wrote:
>>
>> On Wed, Mar 2, 2016 at 5:32 AM, Mark Crutch <mark.crutch@gmail.com> wrote:
>> > I would like to put forward a suggestion to the WG to extend the scope
>> > of
>> > the counter() function to allow it to be used in a CSS property wherever
>> > a
>> > numeric value is allowed. This would only apply to counters of the
>> > "decimal"
>> > type.
>> > ...
>>
>> But a counter-value() function that resolved to the numeric value
>> would work.  One issue is that counters are, in at least some
>> browsers, *terribly* slow and hacky, so exposing counters for more
>> things might not go over well.
>
> counter-value() sounds good to me. It's a shame about the speed in some
> browsers, but even with that limitation I still think this would be a
> worthwhile addition to the spec. In particular:
>
> * More use of counter values within CSS might encourage browser vendors to
> improve the performance of their implementations.
>
> * Without something like this authors can end up having to manually specify
> values that could otherwise be automatically generated - as in the flexbox
> order example in my original post. That not only places more of a burden on
> the author, but leads to less maintainable code as any changes to the DOM
> order would require a corresponding manual update to the CSS.
>
> * Alternatively authors might automate the process with JS - typically by
> using querySelectorAll() then looping over the resultant collection to set a
> value via the style property. This is harder to write, fails when JS is
> inactive, and must surely be slower than even the worst of the browsers'
> native counter implementations. It's also likely to lead to FOUC and reflow
> issues as calculating elements' final positions isn't possible until the JS
> has run.
>
>
> In my specific case there are potentially several dozen flexbox children
> (the amount varies, as it's data driven), and I only want to explicitly
> change the order of one or two of them. By necessity I'll be using a JS
> solution for now, but it does feel like using a hammer to crack a nut and I
> would definitely prefer a declarative solution that's kept entirely in the
> CSS.

Okay, I've added an issue about this to the Lists spec (end of section
9).  I'll deal with editting it into either this or the next level
when I clean up this spec for proper publication soon.

~TJ

Received on Monday, 14 March 2016 22:39:42 UTC