Una Kravets
Mason Freed
Le positionnement des ancres CSS a été publié dans Chrome 125. Cette première version publique de l'API a déclenché des discussions supplémentaires sur la syntaxe . Suite à cette discussion, nous avons apporté quelques modifications mineures depuis le lancement de la fonctionnalité. Si vous avez déjà essayé le positionnement d'ancre CSS, cet article explique les modifications que vous devez apporter à votre code ou au contenu sur le positionnement d'ancre.
Il existe deux principaux changements de nom de propriété à prendre en compte:
inset-areaa été renomméposition-area. Le groupe de travail CSS a préféré ce changement de nom, car la formulationposition-vous aide à vous rappeler que cette propriété s'applique à l'élément positionné, et non à l'élément d'ancrage. Ce changement sera appliqué à partir de Chrome 129.inset-areasera compatible jusqu'à Chrome 131 pour vous laisser le temps de mettre à jour vos démonstrations ou articles.position-try-optionsa été renomméposition-try-fallbacks. Ce changement de nom vous rappelle qu'il ne s'agit que de solutions de remplacement pour la position principale, qui est déterminée par les styles de base. Ce changement a été publié avec Chrome 128, etposition-try-optionsne fonctionne plus à partir de la version 128. Nous vous recommandons d'utiliser l'abréviation (en la remplaçant parposition-try), qui fonctionne à partir de Chrome 125 et n'a pas changé.
Un autre changement de comportement est également à noter:
- La syntaxe fonctionnelle
inset-area()est supprimée deposition-try. Par conséquent, utilisezposition-try-fallbacks: topau lieu deposition-try-fallbacks: inset-area(top). Ce changement sera également appliqué à partir de Chrome 129.
Pour en savoir plus sur l'utilisation du positionnement par ancrage, consultez les ressources suivantes: