Le positionnement par ancre (anchor positioning) est une nouvelle fonctionnalité CSS qui permet de positionner visuellement un élément par rapport à un autre, indépendamment de leur place dans le DOM. Idéal pour les info-bulles, menus contextuels ou modales, il utilise anchor-name pour définir une ancre et position-anchor pour l’associer à un élément positionné (en absolute ou fixed). Le placement s’effectue via anchor() ou position-area, tandis que anchor-size() permet d’adapter les dimensions de l’élément en fonction de l’ancre. La propriété position-try gère les débordements en proposant des solutions de repli. Compatible avec les navigateurs modernes, cette technique offre une alternative flexible aux méthodes traditionnelles, tout en nécessitant une attention particulière à l’accessibilité. Des outils comme Anchor Tool et des démos pratiques illustrent son potentiel.
26011 shaares