Re: [csswg-drafts] [css-transforms-2] The readiness of shipping individual transform properties - translate, rotate, scale (#4515)

> Is there any discussion about long-hand properties like scale-x, scale-y, etc?

I'm also interested in this. I'm currently looking at refactoring a virtual grid component that specifies `top` throw a `.row-n` class name and `left` through a `.col-n` class name. The CSS ends up looking something like this (obviously simplified):

```css
.row-0 { top: 0px; }
.row-1 { top: 24px; }
.row-2 { top: 48px; }

.col-0 { left: 0px; }
.col-1 { left: 80px; }
.col-2 { left: 160px; }
```

Each cell is then assigned the row or column class according to its position in the grid. Refactoring this isn't as straightforward as I'd hoped, because I can't use `translate-x` and `translate-y`. I can use a CSS custom properties, but I've found that the resolution process for those offsets the performance gain that updating `transform` provides and, in the case of pages with a large number of elements, sometimes makes performance significantly worse. That's possibly something that browser engines could mitigate but it would be nice if I didn't have to worry about using custom properties at all.

-- 
GitHub Notification of comment by andyearnshaw
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/4515#issuecomment-1153611690 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Monday, 13 June 2022 08:12:50 UTC