Lynx

offset-rotate

Introduction

The offset-rotate CSS property defines the orientation of an element as it is positioned along the path defined by offset-path.

Use offset-rotate with offset-path and offset-distance to decide whether the element follows the path tangent or keeps a fixed rotation while moving along the path.

Examples

Syntax

offset-rotate: auto;
offset-rotate: 0deg;
offset-rotate: 90deg;
offset-rotate: 360deg;

Values

  • auto

    The element rotates by the angle between the path direction at its current position and the positive x-axis. This is the default value.

  • <angle>

    The element keeps the specified clockwise rotation while positioned on the path. Use 0deg when the element should not rotate with the path.

Info

Lynx currently supports auto and <angle> values in the range 0deg to 360deg.

Formal definition

Initial valueauto
Applies toall elements
Inheritedno
Animatableno

Formal syntax

offset-rotate = auto | <angle>

Difference from Web

  1. Lynx does not support auto <angle>, where the specified angle is added to the automatic path direction.
  2. Lynx does not support reverse, which is equivalent to auto 180deg on the Web.

Compatibility

LCD tables only load in the browser

Except as otherwise noted, this work is licensed under a Creative Commons Attribution 4.0 International License, and code samples are licensed under the Apache License 2.0.