Propriété CSS offset-position

La propriété offset-position spécifie la position initiale du chemin de décalage.

Si la propriété position est spécifiée avec la valeur "static", la propriété offset-position sera ignorée.

La propriété offset-positionest aussi ignorée lorsque la propriété offset-path est "geometry-box", ou "basic shape".

Valeur initiale	auto
Appliquée à	Éléments transformables.
Héritée	Non.
Animable	Oui.
Version	Motion Path Module Level 1
Syntaxe DOM	Object.style.offsetPosition = "auto";

Syntaxe

offset-position: auto | <position> | initial | inherit;

Exemple

<!DOCTYPE html>
<html>
  <head>
    <title>Titre du document</title>
    <style>
      #element1{
      position: relative;
      width: 300px;
      height: 300px;
      border: 2px solid #666;
      }
      #element2{
      width: 100px;
      height: 100px;
      background-color: #1c87c9;
      position: absolute;
      top: 90px;
      left: 100px;
      offset-position: auto;
      offset-anchor: center;
      offset-path: ray(45deg);
      }
    </style>
  <body>
    <h2>Exemple de la propriété offset-position</h2>
    <div id="element1">
      <div id="element2"></div>
    </div>
  </body>
</html>

Essayez-vous-même!

Valeurs

Valeur	Description
auto	Indique que la position initiale est la position de la boîte qui est spécifiée avec la propriété position.
<position>	Spécifie la position initiale, avec le bloc englobant comme un zone de positionnement et un point sans dimension (boîte de la taille 0) comme la zone de l'élément.
initial	Fait utiliser la valeur initiale.
inherit	Hérite la propriété de son élément parent.