← Back to release summary

Support stroke-box, content-box and border-box in the transform-box CSS property

Category
CSS
Type
Chromium catches up
Status
Enabled by default (Chrome 118)
Intent stage
Prepare to ship

WPT details: https://wpt.fyi/results/css/css-transforms/transform-box?label=experimental&label=master&aligned https://wpt.fyi/results/css/css-transforms/parsing?label=experimental&label=master&aligned

Summary

Allows changing how the reference box for the 'transform' property is computed. This adds additional capabilities that will allow creating transforms/graphical effects where - for example - the width of the border of an element does not influence the result (e.g rotation around a point in the content box) or the stroke of an (SVG) element should influence the result (e.g rotating a stroked shape around its center - including the stroke).

Standards & signals

Ecosystem

Samples: https://developer.mozilla.org/en-US/docs/Web/CSS/transform-box

View on chromestatus.com