recursal/MDN huggingface dataset:
:paused
=======

**Expérimental:** **Cette fonction est expérimentale**  
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.  
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.

Le sélecteur de pseudo-classe CSS **`:paused`** est une pseudo-classe d'état d'une ressource audio, vidéo ou autre type de ressource capable d'être « lue » ou « mise en pause », qui permet de cibler un élément lorsqu'il est « mis en pause ».

`:paused` correspond à tout élément non activé ou mis en pause explicitement par la personne utilisant la ressource.


```css
:paused {
}
```

Syntaxe
-------

Error: could not find syntax for this itemExemples
--------

### CSS


```css
:paused {
  border: 5px solid orange;
}
```

Spécifications
--------------

| Specification |
| --- |
| Selectors Level 4 # selectordef-paused |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* `:playing`
Types CSS
=========

Le module ***CSS basic data types*** définit les différents types de données CSS qui permettent de définir les types de valeurs (mots-clés et unités) acceptées par les différentes propriétés et fonctions. Lorsqu'on utilise une notation formelle, les types de données sont représentés par un mot-clé entre chevrons (< >).

**Note :** Les types de donnée CSS sont un type spécial de composant de type de valeur.

Référence
---------

* `<angle>`
* `<angle-percentage>`
* `<angular-color-hint>`
* `<angular-color-stop>`
* `<attr-fallback>`
* `<attr-name>`
* `<basic-shape>`
* `<blend-mode>`
* `<calc-product>`
* `<calc-sum>` (en-US)
* `<calc-value>`
* `<color>`
* `<color-stop>`
* `<color-stop-angle>`
* `<counter-style>`
* `<custom-ident>`
* `<dimension>`
* `<filter-function>`
* `<flex>`
* `<frequency>`
* `<frequency-percentage>`
* `<gradient>`
* `<ident>` (en-US)
* `<image>`
* `<integer>`
* `<length>`
* `<length-percentage>`
* `<number>`
* `<number-percentage>`
* `<percentage>`
* `<position>`
* `<quote>`
* `<ratio>`
* `<resolution>`
* `<shape-box>`
* `<shape-radius>`
* `<string>`
* `<time>`
* `<time-percentage>`
* `<easing-function>`
* `<toggle-value>`
* `<transform-function>`
* `<type-or-unit>`
* `<url>()`
* `<url-modifier>`
* `<zero>`
Spécifications
--------------

| Specification |
| --- |
| CSS Values and Units Module Level 4  |

Voir aussi
----------

* Unités et valeurs CSS
* Introduction à CSS : les valeurs et les unités
min-block-size
==============

**Expérimental:** **Cette fonction est expérimentale**  
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.  
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.

La propriété **`min-block-size`** définit la taille minimale horizontale ou verticale d'un élément de bloc (*block*) selon le mode d'écriture utilisé. Cette propriété « logique » correspond à la propriété `min-width` ou `min-height` selon la valeur utilisée pour `writing-mode`.

Exemple interactif
------------------

Si le mode d'écriture est orienté verticalement, `min-block-size` fait référence à la hauteur minimale de l'élément. Sinon, elle fait référence à la largeur minimale de l'élément. to the minimal height of the element, otherwise it relates to the minimal width of the element. La propriété `min-inline-size` peut être utilisée pour les éléments en ligne.

Syntaxe
-------


```css
/\* Valeurs de longueur \*/
/\* Type <length> \*/
min-block-size: 100px;
min-block-size: 5em;

/\* Valeurs proportionnelles à la \*/
/\* largeur du bloc englobant \*/
/\* Type <percentage> \*/
min-block-size: 10%;

/\* Valeurs avec un mot-clé \*/
min-block-size: max-content;
min-block-size: min-content;
min-block-size: fit-content;
min-block-size: fill-available;

/\* Valeurs globales \*/
min-block-size: inherit;
min-block-size: initial;
min-block-size: unset;
```

### Valeurs

La propriété `min-block-size` peut prendre les mêmes valeurs que les propriétés `min-width` ou `min-height`.

Définition formelle
-------------------

|  |  |
| --- | --- |
| Valeur initiale | `0` |
| Applicabilité | identique à `width` et à `height` |
| Héritée | non |
| Pourcentages | la taille de bloc du bloc englobant |
| Valeur calculée | identique à `min-width` et à `min-height` |
| Type d'animation | une longueur, pourcentage ou calc() ; |

Syntaxe formelle
----------------
```

min-block-size =   
  <'min-width'>    
  
```

Exemples
--------

### CSS


```css
.exemple {
  writing-mode: vertical-rl;
  background-color: yellow;
  block-size: 5%;
  min-block-size: 200px;
}
```

### HTML


```html
<p class="exemple">Texte d'exemple</p>
```

### Résultat

Spécifications
--------------

| Specification |
| --- |
| CSS Logical Properties and Values Level 1 # propdef-min-block-size |
| CSS Box Sizing Module Level 4 # sizing-values |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* Les propriétés physiques correspondantes
    + `min-width`
    + `min-height`
* `writing-mode`
:-moz-locale-dir(rtl)
=====================

**Non standard:** Cette fonctionnalité n'est ni standard, ni en voie de standardisation. Ne l'utilisez pas pour des sites accessibles sur le Web : elle ne fonctionnera pas pour tout utilisateur. Il peut également y avoir d'importantes incompatibilités entre les implémentations et son comportement peut être modifié dans le futur.

La pseudo-classe CSS **`:-moz-locale-dir(rtl)`** correspond à un élément si l'interface utilisateur est affichée de droite à gauche. Elle est déterminée par la préférence `intl.uidirection.locale` (où `locale` est la langue courante) qui est fixée à `"rtl"`.

Cela permet aux extensions (et thèmes) d'adapter facilement leur interface utilisateur basée sur les besoins de la langue de l'utilisateur. Cela peut varier d'une fenêtre à une autre et même d'un onglet à un autre. Cela permet aussi aux extensions de fonctionner même si elles ne prennent pas en compte la langue de l'utilisateur par défaut, puisqu'elles peuvent prendre en compte les agencements de gauche à droite et de droite à gauche sans être inquiétées par les spécificités de la langue.

Ce sélecteur ne fonctionne pas correctement pour des documents HTML ; il ne fait jamais correspondre, peu importe si la langue de l'interface utilisateur va de gauche à droite ou de droite à gauche.

Exemples
--------

### CSS


```css
p:-moz-locale-dir(rtl) {
  color: red;
}
```

### HTML


```html
<p>En utilisant une interface de droite à gauche, ce texte sera rouge.</p>
```

### Résultat

Spécifications
--------------

Cette pseudo-classe est une pseudo-classe propriétaire liée à Gecko/Mozilla et ne fait partie d'aucune spécification.

Voir aussi
----------

* `:-moz-locale-dir(ltr)`
* Garantir le fonctionnement de votre thème avec les locales RTL
-webkit-text-stroke-color
=========================

**Non standard:** Cette fonctionnalité n'est ni standard, ni en voie de standardisation. Ne l'utilisez pas pour des sites accessibles sur le Web : elle ne fonctionnera pas pour tout utilisateur. Il peut également y avoir d'importantes incompatibilités entre les implémentations et son comportement peut être modifié dans le futur.

La propriété **`-webkit-text-stroke-color`** permet de définir la couleur de la ligne utilisée pour le contour du text. Si cette propriété n'est pas définie, c'est la valeur de `color` qui sera utilisée.


```css
/\* Valeurs de couleur \*/
/\* Type <color> \*/
-webkit-text-stroke-color: red;
-webkit-text-stroke-color: #e08ab4;
-webkit-text-stroke-color: rgb(200, 100, 0);

/\* Valeurs globales \*/
-webkit-text-stroke-color: inherit;
-webkit-text-stroke-color: initial;
-webkit-text-stroke-color: unset;
```


|  |  |
| --- | --- |
| Valeur initiale | `currentcolor` |
| Applicabilité | tous les éléments |
| Héritée | oui |
| Valeur calculée | couleur calculée |
| Type d'animation | une couleur |

Syntaxe
-------

### Valeurs

`<color>`

La couleur du contour pour les lettres.

### Syntaxe formelle
```

-webkit-text-stroke-color =   
  <color>    
  
```

Exemples
--------

### HTML


```html
<p>Texte avec un contour</p>
<input type="color" value="#ff0000" />
```

### CSS


```css
p {
  margin: 0;
  font-size: 4em;
  -webkit-text-stroke-width: 3px;
  -webkit-text-stroke-color: #ff0000;
  /\* Cette valeur peut être modifiée \*/
}
```


```
var colorPicker = document.querySelector("input");
colorPicker.addEventListener("change", function (evt) {
  document.querySelector("p").style.webkitTextStrokeColor = evt.target.value;
});
```

### Résultat

Spécifications
--------------

| Specification |
| --- |
| Compatibility Standard # the-webkit-text-stroke-color |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* Le billet de *Surfin' Safari* qui annonce cette fonctionnalité (en anglais)
* L'article de CSS-Tricks à propos de cette fonctionnalité (en anglais)
* `-webkit-text-fill-color`
* `-webkit-text-stroke-width`
* `-webkit-text-stroke`
-webkit-mask-repeat-x
=====================

**Non standard:** Cette fonctionnalité n'est ni standard, ni en voie de standardisation. Ne l'utilisez pas pour des sites accessibles sur le Web : elle ne fonctionnera pas pour tout utilisateur. Il peut également y avoir d'importantes incompatibilités entre les implémentations et son comportement peut être modifié dans le futur.

La propriété **`-webkit-mask-repeat-x`** définit la façon dont une image de masque est répétée horizontalement.


```css
/\* Valeurs avec un mot-clé \*/
-webkit-mask-repeat-x: repeat;
-webkit-mask-repeat-x: no-repeat;
-webkit-mask-repeat-x: space;
-webkit-mask-repeat-x: round;

/\* Valeurs multiples \*/
-webkit-mask-repeat-x: repeat, no-repeat, space;

/\* Valeurs globales \*/
-webkit-mask-repeat-x: inherit;
-webkit-mask-repeat-x: initial;
-webkit-mask-repeat-x: unset;
```

Syntaxe
-------

### Valeurs

`repeat`

L'image de masque est répétée horizontalement.

`no-repeat`

L'image de masque n'est pas répétée horizontalement, seul un exemplaire est dessiné selon l'axe horizontal. Le contenu restant sur l'axe horizontal pour les éléments masqués n'est pas affiché.

`space`

L'image est répétée tant que possible sans être rognée. La première et la dernière images sont accolées aux bords droit et gauche de l'élément et l'espace restant est réparti entre les copies de l'image. La propriété `mask-position` est ignorée sauf si une seule image peut être affichée sans qu'il n'y ait de rognage. On aura uniquement du rognage s'il n'y a pas suffisamment d'espace pour afficher une seule image.

`round`

L'image est répétée et les différents exemplaires sont tous étirés de la même façon afin qu'il n'y ait pas d'espace entre chaque. Ainsi, une image qui mesure originellement 260px et qui est répétée trois fois pourra être étirée jusqu'à ce que chaque répétition soit large de 300px, ensuite une autre image sera ajoutée et toutes seront compressées à 225px.

### Syntaxe formelle

Error: could not find syntax for this itemExemples
--------


```css
.exempleun {
  -webkit-mask-image: url("mask.png");
  -webkit-mask-repeat-x: repeat;
}

.exempledeux {
  -webkit-mask-image: url("mask.png");
  -webkit-mask-repeat-x: no-repeat;
}
```

### Gestion de plusieurs images

On peut définir un style de répétition (`<repeat-style>`) différent pour chacune des images de masque en séparant les valeurs par des virgules :


```css
.exempletrois {
  -webkit-mask-image: url("mask1.png"), url("mask2.png");
  -webkit-mask-repeat-x: repeat, space;
}
```


Chaque image aura la valeur associée, dans le même ordre.

|  |  |
| --- | --- |
| Valeur initiale | `repeat` |
| Applicabilité | tous les éléments |
| Héritée | non |
| Valeur calculée | comme spécifié |
| Type d'animation | discrète |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* `-webkit-mask-repeat` (en-US),
* `-webkit-mask-repeat-y`
scroll-margin
=============

La propriété `scroll-margin` est une propriété raccourcie qui permet de définir l'ensemble des propriétés `scroll-margin-top`, `scroll-margin-left`, `scroll-margin-bottom` et `scroll-margin-right` (de la même façon que la propriété `margin` définit les différents côtés des marges).

Exemple interactif
------------------

Les valeurs de `scroll-margin` correspondent aux décalages entre la zone qui est utilisée pour définir les limites du défilement de la boîtes et la zone de défilement normale (*snapport*). La zone de défilement est déterminée en prenant la boîte de bordure modifiée, en prenant le rectangle englobant puis en ajoutant les décalages indiqués.

Syntaxe
-------


```css
/\* Valeur de longueur \*/
/\* Type <length> \*/
scroll-margin: 10px;
scroll-margin: 1em 0.5em 1em 1em;

/\* Valeurs globales \*/
scroll-margin: inherit;
scroll-margin: initial;
scroll-margin: unset;
```

### Valeurs

`<length>`

Un décalage par rapport au côté correspondant pour le conteneur de défilement. Voir `<length>` pour les valeurs possibles.

Définition formelle
-------------------

|  |  |
| --- | --- |
| Valeur initiale | pour chaque propriété individuelle de la propriété raccourcie :* `scroll-margin-bottom`: `0`
* `scroll-margin-left`: `0`
* `scroll-margin-right`: `0`
* `scroll-margin-top`: `0`
 |
| Applicabilité | tous les éléments |
| Héritée | non |
| Valeur calculée | pour chaque propriété individuelle de la propriété raccourcie :* `scroll-margin-bottom`: comme spécifié
* `scroll-margin-left`: comme spécifié
* `scroll-margin-right`: comme spécifié
* `scroll-margin-top`: comme spécifié
 |
| Type d'animation | by computed value type |

Syntaxe formelle
----------------
```

scroll-margin =   
  <length>{1,4}    
  
```

Spécifications
--------------

| Specification |
| --- |
| CSS Scroll Snap Module Level 1 # scroll-margin |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
::backdrop
==========

Le pseudo-élément **`::backdrop`** est une boîte de la taille de la zone d'affichage (*viewport*) qui est affichée immédiatement sous un élément lorsque ce dernier est affiché en plein écran. Cela correspond aux éléments passés en plein écran via l'API Fullscreen et aux éléments `<dialog>`.

Lorsque plusieurs éléments sont en plein écran, ce pseudo-élément est dessiné derrière l'élément qui est le plus en avant et par dessus les autres éléments.


```css
// Cette ombre n'est affichée que lorsque la boîte de dialogue
// est ouverte avec dialog.showModal()
dialog::backdrop {
  background: rgba(255,0,0,.25);
}
```


**Note :** L'élément `::backdrop` peut être utilisé comme un arrière-plan/masque pour l'élément afin de cacher le document en-dessous lorsque l'élément est affiché en plein écran selon la spécification.

Ce pseudo-élément n'hérite d'aucun autre élément et aucun autre élément n'hérite de ce pseudo-élément. Aucune restriction ne s'applique pour les propriétés qui peuvent être appliquées à ce pseudo-élément.

Syntaxe
-------

Error: could not find syntax for this itemExemples
--------

Dans cet exemple, on indique que l'ombre derrière la vidéo en plein écran doit être bleu-gris plutôt que noire.


```css
video::backdrop {
  background-color: #448;
}
```


Voici le résultat obtenu :

![](/fr/docs/Web/CSS/::backdrop/bbb-backdrop.png)

On peut voir ici les bandes bleu-gris au dessus et en dessous de la vidéo alors que la zone est normalement noire.

Vous pouvez voir cette démonstration en *live* ou voir et modifier le code sur Glitch.

Spécifications
--------------

| Specification |
| --- |
| CSS Positioned Layout Module Level 4 # backdrop |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* La pseudo-classe `:fullscreen`
* L'élément HTML `<dialog>`
* L'API Fullscreen
Colonnes CSS
============

**Les colonnes CSS** (*CSS Multi-column Layout* en anglais) forment un module CSS qui définit le comportement d'une disposition en colonnes, qui permet de décrire comment le contenu doit être réparti entre les colonnes et qui détaille comment sont gérées les espaces et les règles entre les colonnes.

Exemple simple
--------------

Dans l'exemple qui suit, on applique la propriété `column-count` sur l'élément qui possède la classe `container`. La valeur de la propriété `column-count` est `3`, et le contenu est donc arrangé entre trois colonnes de tailles égales.

Liens avec le module de spécification CSS Fragmentation
-------------------------------------------------------

La disposition en colonnes est fortement liée aux média paginés pour lesquels chaque colonne devient un fragment (de la même façon qu'une page imprimée devient un fragment d'un document). Aussi, les propriétés désormais définies dans le module de spécification CSS Fragmentation sont nécessaires afin de contrôler la façon dont le contenu est scindé entre les colonnes.

Référence
---------

### Propriétés relatives à la disposition en colonnes

* `column-count`
* `column-fill`
* `column-gap`
* `column-rule`
* `column-rule-color`
* `column-rule-style`
* `column-rule-width`
* `column-span`
* `column-width`
* `columns`
### Propriétés relatives à la fragmentation

* `break-after`
* `break-before`
* `break-inside`
* `orphans`
* `widows`
Guides
------

Concepts de base relatifs à la disposition en colonnes

Un aperçu du module de spécification CSS pour la disposition avec plusieurs colonnes.

Mettre en forme les colonnes

Comment utiliser les règles liées aux colonnes et gérer l'espace entre les colonnes.

Équilibrer le remplissement des colonnes

Comment répartir un élément sur plusieurs colonnes et comment contrôler la façon dont les colonnes sont remplies.

Gérer le dépassement

Comprendre ce qui se produit quand un élément dépasse de la colonne à laquelle il appartient et ce qui se produit lorsqu'il y a trop de contenu pour un conteneur en colonnes.

Gérer la fragmentation du contenu en multi-colonnes

Une introduction au module de spécification CSS Fragmentation et à la façon dont le contenu est coupé entre les colonnes.

Spécifications
--------------

| Specification |
| --- |
| CSS Multi-column Layout Module Level 1  |

Voir aussi
----------

Les autres modules liées aux dispositions possibles en CSS :

* Les boîtes flexibles (*flexbox*)
* Les grilles CSS (*CSS Grid*)
<flex>
======

Baseline Widely available
-------------------------

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2020.

* Learn more
* See full compatibility
* Report feedback
Le type de donnée CSS **`<flex>`** permet de représenter une longueur flexible à l'intérieur d'un conteneur en grille, qui est déclarée comme une dimension d'unité `fr`. Il est notamment utilisé pour les propriétés `grid-template-columns`, `grid-template-rows` ainsi que d'autres.

Syntaxe
-------

Le type de donnée `<flex>` est défini par un nombre (`<number>` suivi de l'unité `fr`. L'unité `fr` représente une **fr**action de l'espace restant dans le conteneur en grille. Comme pour les autres dimensions, il n'y a pas d'espace entre la valeur et l'unité.

Exemples
--------


```css
1fr    /\* Utilisation d'une valeur entière \*/
2.5fr  /\* Utilisation d'une valeur flottante \*/
```

Spécifications
--------------

| Specification |
| --- |
| CSS Grid Layout Module Level 2 # fr-unit |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* Le mode de disposition en grille (CSS Grid)
<time-percentage>
=================

Le type de donnée **`<time-percentage>`** représente une valeur qui peut être de type `<time>` ou une valeur qui peut être de type `<percentage>`.

Syntaxe
-------

Se référer à la documentation des types `<time>` et `<percentage>` pour plus de détails sur les syntaxes possibles pour chacun de ces types.

Utilisation avec `calc()`
-------------------------

Lorsqu'une valeur de type `<time-percentage>` est autorisée dans une déclaration, cela signifie que le pourcentage sera résolu comme un temps et qu'il peut donc être utilisée dans une expression `calc()`.

Spécifications
--------------

| Specification |
| --- |
| CSS Values and Units Module Level 4 # mixed-percentages |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
inset-inline-start
==================

**Expérimental:** **Cette fonction est expérimentale**  
Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.  
Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.

La propriété **`inset-inline-start`** définit le début du décalage logique en ligne (*inline*) d'un élément, selon le mode d'écriture, la directionnalité et l'orientation. Elle correspond à une des propriétés parmi `top`, `right`, `bottom` ou `left` selon les valeurs des propriétés `writing-mode`, `direction` et `text-orientation`.

**Note :** Avant Firefox 63, cette propriété était implémentée avec le nom `offset-inline-start`. Firefox 63 a mis à jour son implémentation afin de suivre les modifications apportées à la spécification.


```css
/\* Valeurs de longueur \*/
/\* Type <length> \*/
inset-inline-start: 3px;
inset-inline-start: 2.4em;

/\* Valeurs relatives à la largeur \*/
/\* du bloc englobant \*/
/\* Type <percentage> \*/
inset-inline-start: 10%;

/\* Valeurs avec un mot-clé \*/
inset-inline-start: auto;

/\* Valeurs globales \*/
inset-inline-start: inherit;
inset-inline-start: initial;
inset-inline-start: unset;
```


Elle est liée aux propriétés `inset-block-start`, `inset-block-end` et `inset-inline-end` qui permettent de définir les autres décalages de l'élément.

Syntaxe
-------

### Valeurs

La propriété `inset-inline-start` peut prendre les mêmes valeurs que la propriété `left`.

Définition formelle
-------------------

|  |  |
| --- | --- |
| Valeur initiale | `auto` |
| Applicabilité | éléments positionnés |
| Héritée | non |
| Pourcentages | largeur logique du bloc englobant |
| Valeur calculée | identiques aux propriétés qui décalent les boîtes : `top`, `right`, `bottom`, `left` sauf que ces directions sont logiques |
| Type d'animation | une longueur, pourcentage ou calc() ; |

Syntaxe formelle
----------------
```

inset-inline-start =   
  auto                 |  
  <length-percentage>    
  
<length-percentage> =   
  <length>      |  
  <percentage>    
  
```

Exemples
--------

### HTML


```html
<div>
  <p class="exemple">Texte pour l'exemple</p>
</div>
```

### CSS


```css
div {
  background-color: yellow;
  width: 120px;
  height: 120px;
}

.exemple {
  writing-mode: vertical-lr;
  position: relative;
  inset-inline-start: 20px;
  background-color: #c8c800;
}
```

### Résultat

Spécifications
--------------

| Specification |
| --- |
| CSS Logical Properties and Values Level 1 # position-properties |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* Les propriétés physiques correspondantes :
    + `top`
    + `right`
    + `bottom`
    + `left`
* Les autres propriétés qui définissent les autres décalages : `inset-block-start`, `inset-block-end` et `inset-inline-end`
* `writing-mode`
* `direction`
* `text-orientation`