blob: 18954571771e83a4f1c0eff586ce0a8445aea59c (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
|
---
title: scroll-padding-left
slug: Web/CSS/scroll-padding-left
tags:
- CSS
- Propriété
- Reference
translation_of: Web/CSS/scroll-padding-left
---
{{CSSRef}}
La propriété **`scroll-padding-left`** est une propriété qui permet de définir le remplissage sur le côté gauche entre l'élément et la zone de défilement.
Les propriétés pour le remplissage de la zone de défilement 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.
{{EmbedInteractiveExample("pages/css/scroll-padding-left.html")}}
## Syntaxe
```css
/* Valeurs avec un mot-clé */
scroll-padding-left: auto;
/* Valeurs de longueur */
/* Type <length> */
scroll-padding-left: 10px;
scroll-padding-left: 1em;
scroll-padding-left: 10%;
/* Valeurs globales */
scroll-padding-left: inherit;
scroll-padding-left: initial;
scroll-padding-left: unset;
```
### Valeurs
- `<length-percentage>`
- : Un décalage intérieur entre la boîte de défilement et le bord correspondant de l'élément. C'est une longueur ou un pourcentage valide.
- `auto`
- : Le décalage est déterminé par l'agent utilisateur. Cette valeur correspond généralement à `0px` mais 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
{{csssyntax}}
## Spécifications
| Spécification | État | Commentaires |
| ---------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------ | -------------------- |
| {{SpecName("CSS Scroll Snap Points", "#propdef-scroll-padding-left", "scroll-padding-left")}} | {{Spec2("CSS Scroll Snap Points")}} | Définition initiale. |
{{cssinfo}}
## Compatibilité des navigateurs
{{Compat("css.properties.scroll-padding-left")}}
|