Position par ancres CSS
Le module de position par ancres CSS définit des fonctionnalités permettant d'attacher des éléments entre eux. Certains éléments sont définis comme des éléments ancre ; les éléments positionnés par ancre peuvent alors avoir leur taille et leur position définies en fonction de la taille et de la position des éléments ancre auxquels ils sont liés.
De plus, la spécification fournit des mécanismes CSS permettant de :
- Définir un ensemble de positions alternatives pour un élément ancré ; lorsque la position de rendu par défaut le fait déborder de son bloc conteneur et/ou l'affiche hors écran, le navigateur essaie d'afficher l'élément ancré dans les positions alternatives.
- Déclarer des conditions dans lesquelles les éléments positionnés par ancre doivent être masqués, dans les situations où il n'est pas approprié de les attacher à des éléments ancre.
Référence
Propriétés
Règles @ et descripteurs
Fonctions
Types de données et valeurs
Attributs HTML
Interfaces
Guides
- Utiliser la position par ancres CSS
-
Un guide d'introduction aux concepts fondamentaux du positionnement par ancre, incluant l'association, le positionnement et le dimensionnement des éléments par rapport à leur ancre.
- Options de repli et masquage conditionnel en cas de dépassement
-
Un guide sur les mécanismes que le positionnement par ancre CSS propose pour éviter que les éléments positionnés par ancre ne débordent de leur conteneur ou de la fenêtre, incluant les options de repli et le masquage conditionnel.
- Utiliser les requêtes de conteneurs ancrés
-
Explique comment utiliser les requêtes de conteneurs ancrés pour appliquer conditionnellement des styles aux éléments positionnés par ancre en fonction des options de repli de position actives sur eux.
Concepts associés
- Le modude des propriétés et valeurs logiques CSS :
inset-block-startinset-block-endinset-inline-startinset-inline-endinset-blockinset-inlineinset(raccourcie)inline-sizemin-block-sizemin-inline-sizeblock-sizemax-block-sizemax-inline-sizemargin-blockmargin-block-endmargin-block-startmargin-inlinemargin-inline-endmargin-inline-start- Le terme de glossaire Propriétés inset
- Le module de mise en page positionnée CSS :
- Le module de modèle de boîte CSS :
- Le module de alignement des boîtes CSS :
Spécifications
| Spécification |
|---|
| CSS Anchor Positioning Module Level 1 |
| CSS Anchor Positioning Module Level 2 |