scroll-padding
La propriété scroll-padding est une propriété raccourcie qui permet de définir l'ensemble des propriétés scroll-padding-top, scroll-padding-right, scroll-padding-bottom et scroll-padding-left (de la même façon que la propriété padding permet de définir les propriétés détaillées associées).
Les propriétés scroll-padding-* permettent de définir des décalages par rapport à la zone de défilement de l'élément (scrollport). On peut ainsi éviter à un élément d'être affiché là où d'autres barres sont présentes ou encore donner plus d'espace entre un élément et les barres de défilement pour y naviguer.
Syntaxe
/* Valeurs avec un mot-clé */
scroll-padding: auto;
/* Valeurs de longueur */
/* Type <length> */
scroll-padding: 10px;
scroll-padding: 1em .5em 1em 1em;
scroll-padding: 10%;
/* Valeurs globales */
scroll-padding: inherit;
scroll-padding: initial;
scroll-padding: unset;
Valeurs
<length-percentage>- Un décalage intérieur entre la boîte de défilement et le bord correspondant de l'élément. Cette valeur, de type
<length-percentage>, est une longueur (<length>) ou un pourcentage (<percentage>) valide. auto- Le décalage est déterminé par l'agent utilisateur. Cette valeur correspond généralement à
0pxmais le navigateur peut utiliser une heuristique et déterminer si une valeur non nulle est préférable au regard du contexte dans lequel se trouve l'élément.
Syntaxe formelle
[ auto | <length-percentage> ]{1,4}où
<length-percentage> = <length> | <percentage>
Specifications
| Spécification | État | Commentaires |
|---|---|---|
| CSS Scroll Snap Module Level 1 La définition de 'scroll-padding' dans cette spécification. |
Candidat au statut de recommandation | Définition initiale. |
| Valeur initiale | auto |
|---|---|
| Applicabilité | conteneurs d'ascenseurs |
| Héritée | non |
| Pourcentages | relative to the scroll container's scrollport |
| Valeur calculée | comme spécifié |
| Type d'animation | by computed value type |
Compatibilité des navigateurs
BCD tables only load in the browser