CSS: counter() in arbitrary properties, calc(), etc


#1

I think it would be nice to be able to use counter() function outside of CSS content – e.g. for indents.

I suggest data type specification using attr() syntax, e.g. width: counter(my-counter px).


#2

Could you describe the use case in more detail? I’m interested if it’s possible with CSS today.


#3

Hi simevidas, Ashmind came up with an interesting feature.

A possible user case will be to set the width for all items in an inline set based on the number of items in that set. That way, using it in combination with calc(), you can divide the total width, whether is in px or %, by the number of items and get its individual width, which is very useful when you create dynamic modules.

And no, this is not currently possible with CSS, but it would be great if it was.


#4

Isn’t what you want possible with CSS Flexbox?

Example: https://codepen.io/simevidas/pen/yoMmjx?editors=0100


#5

HI, sorry for the late response. True, not the best example, haha