offset-rotate

Draft
This page is not complete.

This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The offset-rotate CSS property defines the direction of the element while positioning along the offset path.

If 'auto' is given to offset-rotate, the element rotates in the direction of the path defined with offset-path.

Early versions of the spec called this property motion-rotation.

Initial valueauto
Applies totransformable elements
Inheritedno
Mediavisual
Computed valueas specified
Animation typeas <angle>, <basic-shape> or <path()>
Canonical orderper grammar

Syntax

TBD

Formal syntax

[ auto | reverse ] || <angle>

Examples

TBD

Specifications

Specification Status Comment
Motion Path Module Level 1
The definition of 'offset-rotate' in that specification.
Working Draft Initial definition

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
offset-rotate
Experimental
Chrome Full support 56
Full support 56
Full support 55
Alternate Name
Alternate Name Uses the non-standard name: offset-rotation
Full support 46
Alternate Name
Alternate Name Uses the non-standard name: motion-rotation
Edge No support NoFirefox No support NoIE No support NoOpera Full support 43
Full support 43
Full support 42
Alternate Name
Alternate Name Uses the non-standard name: offset-rotation
Full support 33
Alternate Name
Alternate Name Uses the non-standard name: motion-rotation
Safari No support NoWebView Android Full support 56
Full support 56
Full support 55
Alternate Name
Alternate Name Uses the non-standard name: offset-rotation
Full support 46
Alternate Name
Alternate Name Uses the non-standard name: motion-rotation
Chrome Android Full support 56
Full support 56
Full support 55
Alternate Name
Alternate Name Uses the non-standard name: offset-rotation
Full support 46
Alternate Name
Alternate Name Uses the non-standard name: motion-rotation
Edge Mobile ? Firefox Android No support NoOpera Android ? Safari iOS No support NoSamsung Internet Android Full support 6.0

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown
Experimental. Expect behavior to change in the future.
Experimental. Expect behavior to change in the future.
Uses a non-standard name.
Uses a non-standard name.

Document Tags and Contributors

Last updated by: mdnwebdocs-bot,