Minor fixes and updates for some fr CSS pages (#3626)

* Minor fixes and updates for some fr CSS pages

* Nitpicking / minor typoedit

Co-authored-by: julieng <julien.gattelier@gmail.com>

4 files changed, 161 insertions, 231 deletions

diff --git a/files/fr/web/css/min-height/index.md b/files/fr/web/css/min-height/index.md
index 8a18f9726b..7edb5bee93 100644
--- a/files/fr/web/css/min-height/index.md
+++ b/files/fr/web/css/min-height/index.md
@@ -1,19 +1,16 @@
 ---
 title: min-height
 slug: Web/CSS/min-height
-tags:
-  - CSS
-  - Propriété
-  - Reference
 translation_of: Web/CSS/min-height
+browser-compat: css.properties.min-height
 ---
 {{CSSRef}}
 
-La propriété** `min-height`** est utilisée afin de définir la hauteur minimale d'un élément. Elle empêche ainsi que la valeur de la propriété {{cssxref("height")}} devienne inférieure à `min-height`.
+La propriété **`min-height`** est utilisée afin de définir la hauteur minimale d'un élément. Elle empêche ainsi que la [valeur utilisée](/fr/docs/Web/CSS/used_value) de la propriété [`height`](/fr/docs/Web/CSS/height) devienne inférieure à `min-height`.
 
 {{EmbedInteractiveExample("pages/css/min-height.html")}}
 
-La valeur de la propriété `min-height` surcharge celles de {{cssxref("max-height")}} et {{cssxref("height")}} lorsque `min-height` est supérieure.
+La valeur de la propriété `min-height` surcharge celles de [`max-height`](/fr/docs/Web/CSS/max-height) et [`height`](/fr/docs/Web/CSS/height) lorsque `min-height` est supérieure.
 
 ## Syntaxe
 
@@ -22,131 +19,64 @@ La valeur de la propriété `min-height` surcharge celles de {{cssxref("max-heig
 /* Type <length>      */
 min-height: 3.5em;
 
-/* Valeur relative au bloc */
+/* Valeur de proportion */
 /* Type <percentage>       */
 min-height: 10%;
 
 /* Valeurs avec un mot-clé */
 min-height: max-content;
 min-height: min-content;
-min-height: fit-content;
-min-height: fill-available;
+min-height: fit-content(20em);
 
 /* Valeurs globales */
 min-height: inherit;
 min-height: initial;
+min-height: revert;
 min-height: unset;
 ```
 
 ### Valeurs
 
-- `<length>`
-  - : La hauteur minimale exprimée de façon absolue. Voir la page {{cssxref("&lt;length&gt;")}} pour les différentes unités. Les valeurs négatives sont interdites, si elles sont utilisées, la déclaration sera considérée comme invalide.
-- `<percentage>`
-  - : La hauteur minimale exprimée de façon relative à la hauteur du bloc englobant grâce à une valeur de type {{cssxref("&lt;percentage&gt;")}}. Les valeurs négatives sont interdites, si elles sont utilisées, la déclaration sera considérée comme invalide.
-- `max-content` {{experimental_inline}}
+- [`<length>`](/fr/docs/Web/CSS/length)
+  - : La hauteur minimale exprimée de façon absolue.
+- [`<percentage>`](/fr/docs/Web/CSS/percentage)
+  - : La hauteur minimale exprimée de façon relative à la hauteur du bloc englobant grâce à une valeur de type [`<percentage>`](/fr/docs/Web/CSS/percentage).
+- `auto`
+  - : Le navigateur calcule et définit la hauteur minimale de l'élément spécifié.
+- `max-content`
   - : La hauteur intrinsèque préférée.
-- `min-content` {{experimental_inline}}
+- `min-content`
   - : La hauteur intrinsèque minimale préférée.
-- `fill-available`{{experimental_inline}}
-  - : La hauteur du bloc englobant moins celle de la marge verticale, de la bordure et du remplissage (_padding_). Certains navigateurs implémentent cette valeur avec un mot-clé d'une ancienne version : `available`.
-- `fit-content` {{experimental_inline}}
-  - : Selon la spécification CSS3 sur les boîtes (CSS3 Box), cette valeur est synonyme de `min-content.` La spécification CSS3 sur le dimensionnement (CSS3 Sizing) définit un algorithme plus complexe mais qui n'est implémenté par aucun navigateur, y compris de façon expérimentale.
+- `fit-content` ([`<length-percentage>`](/fr/docs/Web/CSS/length-percentage))
+  - : Utilise la formule `fit-content()`, remplaçant l'espace disponible par l'argument passé. Par exemple&nbsp;: `min(max-content, max(min-content, argument))`.
 
-### Syntaxe formelle
+## Définition formelle
 
-{{csssyntax}}
+{{CSSInfo}}
 
-## Exemples
+## Syntaxe formelle
 
-### HTML
+{{csssyntax}}
 
-```html
-<div> Lorem ipsum tralala
-<p class="exemple">toto</p>
- Duis aute irure dolor in reprehender
-</div>
-```
+## Exemples
 
-### CSS
+### Définition de min-height
 
 ```css
-div {
-  height: 150px;
-  border: solid 1px red;
-}
-
-.exemple {
-  min-height: 70%;
-  border: solid 1px blue;
-}
-```
+table { min-height: 75%; }
 
-### Résultat
-
-{{EmbedLiveSample("Exemples")}}
+form { min-height: 0; }
+```
 
 ## Spécifications
 
-<table class="standard-table">
-  <tbody>
-    <tr>
-      <th scope="col">Spécification</th>
-      <th scope="col">Statut</th>
-      <th scope="col">Commentaires</th>
-    </tr>
-    <tr>
-      <td>
-        {{SpecName('CSS3 Sizing', '#width-height-keywords', 'min-height')}}
-      </td>
-      <td>{{Spec2('CSS3 Sizing')}}</td>
-      <td>
-        Ajout des mots-clés <code>max-content</code>, <code>min-content</code>,
-        <code>fit-content</code> et <code>fill-available</code>.
-      </td>
-    </tr>
-    <tr>
-      <td>
-        {{SpecName('CSS3 Flexbox', '#min-auto', 'min-height')}}
-      </td>
-      <td>{{Spec2('CSS3 Flexbox')}}</td>
-      <td>
-        <p>
-          Ajout du mot-clé <code>auto</code> et définition de ce mot-clé comme
-          valeur initiale.
-        </p>
-      </td>
-    </tr>
-    <tr>
-      <td>
-        {{SpecName('CSS3 Transitions', '#animatable-css', 'min-height')}}
-      </td>
-      <td>{{Spec2('CSS3 Transitions')}}</td>
-      <td><code>min-height</code> peut désormais être animée.</td>
-    </tr>
-    <tr>
-      <td>
-        {{SpecName('CSS2.1', 'visudet.html#min-max-heights', 'min-height')}}
-      </td>
-      <td>{{Spec2('CSS2.1')}}</td>
-      <td>Définition initiale.</td>
-    </tr>
-  </tbody>
-</table>
-
-{{cssinfo}}
+{{Specifications}}
 
 ## Compatibilité des navigateurs
 
-{{Compat("css.properties.min-height")}}
+{{Compat}}
 
 ## Voir aussi
 
-- {{cssxref("width")}}
-- {{cssxref("height")}}
-- {{cssxref("max-height")}}
-- [Le modèle de boîtes](/en-US/docs/Learn/CSS/Building_blocks/The_box_model)
-- {{cssxref("min-width")}}
-- {{cssxref("box-sizing")}}
-- {{cssxref("height")}}
-- {{cssxref("max-height")}}
+- [Le modèle de boîtes](/fr/docs/Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model), [`box-sizing`](/fr/docs/Web/CSS/box-sizing)
+- [`height`](/fr/docs/Web/CSS/height), [`max-height`](/fr/docs/Web/CSS/max-height)
diff --git a/files/fr/web/css/padding-inline-start/index.md b/files/fr/web/css/padding-inline-start/index.md
index 81caa13626..2876916e8b 100644
--- a/files/fr/web/css/padding-inline-start/index.md
+++ b/files/fr/web/css/padding-inline-start/index.md
@@ -1,18 +1,12 @@
 ---
 title: padding-inline-start
 slug: Web/CSS/padding-inline-start
-tags:
-  - CSS
-  - Experimental
-  - Propriété
-  - Reference
 translation_of: Web/CSS/padding-inline-start
+browser-compat: css.properties.padding-inline-start
 ---
-{{CSSRef}}{{SeeCompatTable}}
+{{CSSRef}}
 
-La propriété** `padding-inline-start`** définit le décalage avec le début de la zone de remplissage d'un élément, selon le mode d'écriture, la directionnalité et l'orientation du texte. Elle correspond à la propriété {{cssxref("padding-top")}}, {{cssxref("padding-right")}}, {{cssxref("padding-bottom")}} ou {{cssxref("padding-left")}} selon les valeurs définies pour {{cssxref("writing-mode")}}, {{cssxref("direction")}} et {{cssxref("text-orientation")}}.
-
-Les autres parties « logiques » du remplissage sont définies grâce aux propriétés {{cssxref("padding-block-start")}}, {{cssxref("padding-block-end")}} et {{cssxref("padding-inline-end")}}.
+La propriété **`padding-inline-start`** définit le décalage avec le début de la zone de remplissage d'un élément selon le mode d'écriture, la direction et l'orientation du texte.
 
 {{EmbedInteractiveExample("pages/css/padding-inline-start.html")}}
 
@@ -21,8 +15,8 @@ Les autres parties « logiques » du remplissage sont définies grâce aux propr
 ```css
 /* Valeurs de longueur */
 /* Type <length>       */
-padding-inline-start: 10px;
-padding-inline-start: 1em;
+padding-inline-start: 10px; /* Une longueur absolue */
+padding-inline-start: 1em;  /* Relatif à la taille du texte */
 
 /* Valeurs de proportions */
 /* Type <percentage>      */
@@ -31,20 +25,36 @@ padding-inline-start: 5%;  /* Relatif à la largeur du bloc englobant */
 /* Valeurs globales */
 padding-inline-start: inherit;
 padding-inline-start: initial;
+padding-inline-start: revert;
 padding-inline-start: unset;
 ```
 
 ### Valeurs
 
-La propriété `padding-inline-start` peut prendre les mêmes valeurs que la propriété {{cssxref("padding-left")}}.
+- [`<length>`](/fr/docs/Web/CSS/length)
+  - : La taille de la zone de remplissage exprimée de façon absolue. Les valeurs négatives sont interdites.
+- [`<percentage>`](/fr/docs/Web/CSS/percentage)
+  - : La taille de la zone de remplissage exprimée de façon relative à la *taille en ligne* (<i lang="en">inline</i> en anglais) du bloc englobant. Les valeurs négatives sont interdites.
+
+## Description
+
+Selon sa définition dans la spécification, la propriété `padding-inline-start` peut prendre les mêmes valeurs que la propriété [`padding-top`](/fr/docs/Web/CSS/padding-top). Toutefois, elle peut en réalité correspondre à la propriété physique [`padding-top`](/fr/docs/Web/CSS/padding-top), [`padding-right`](/fr/docs/Web/CSS/padding-right) ou [`padding-left`](/fr/docs/Web/CSS/padding-left) selon les valeurs définies pour [`writing-mode`](/fr/docs/Web/CSS/writing-mode), [`direction`](/fr/docs/Web/CSS/direction) et [`text-orientation`](/fr/docs/Web/CSS/text-orientation).
+
+Les autres parties du remplissage sont définies grâce aux propriétés [`padding-block-start`](/fr/docs/Web/CSS/padding-block-start), [`padding-block-end`](/fr/docs/Web/CSS/padding-block-end) et [`padding-inline-end`](/fr/docs/Web/CSS/padding-inline-end).
 
-### Syntaxe formelle
+## Définition formelle
+
+{{CSSInfo}}
+
+## Syntaxe formelle
 
 {{csssyntax}}
 
 ## Exemples
 
-### HTML
+### Définition de padding-inline-start avec du texte vertical
+
+#### HTML
 
 ```html
 <div>
@@ -52,7 +62,7 @@ La propriété `padding-inline-start` peut prendre les mêmes valeurs que la pro
 </div>
 ```
 
-### CSS
+#### CSS
 
 ```css
 div {
@@ -68,31 +78,27 @@ div {
 }
 ```
 
-### Résultat
+#### Résultat
 
-{{EmbedLiveSample("Exemples", 140, 140)}}
+{{EmbedLiveSample("", 140, 140)}}
 
 ## Spécifications
 
-| Spécification                                                                                                                    | État                                             | Commentaires         |
-| -------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------ | -------------------- |
-| {{SpecName("CSS Logical Properties", "#propdef-padding-inline-start", "padding-inline-start")}} | {{Spec2("CSS Logical Properties")}} | Définition initiale. |
-
-{{cssinfo}}
+{{Specifications}}
 
 ## Compatibilité des navigateurs
 
-{{Compat("css.properties.padding-inline-start")}}
+{{Compat}}
 
 ## Voir aussi
 
-- Les propriétés physiques correspondantes :
+- Les propriétés physiques correspondantes&nbsp;:
 
-  - {{cssxref("padding-top")}},
-  - {{cssxref("padding-right")}},
-  - {{cssxref("padding-bottom")}},
-  - {{cssxref("padding-left")}}
+  - [`padding-top`](/fr/docs/Web/CSS/padding-top)
+  - [`padding-right`](/fr/docs/Web/CSS/padding-right)
+  - [`padding-bottom`](/fr/docs/Web/CSS/padding-bottom)
+  - [`padding-left`](/fr/docs/Web/CSS/padding-left)
 
-- {{cssxref("writing-mode")}},
-- {{cssxref("direction")}},
-- {{cssxref("text-orientation")}}
+- [`writing-mode`](/fr/docs/Web/CSS/writing-mode)
+- [`direction`](/fr/docs/Web/CSS/direction)
+- [`text-orientation`](/fr/docs/Web/CSS/text-orientation)
diff --git a/files/fr/web/css/pointer-events/index.md b/files/fr/web/css/pointer-events/index.md
index 4088ac8be2..eb6c536dd3 100644
--- a/files/fr/web/css/pointer-events/index.md
+++ b/files/fr/web/css/pointer-events/index.md
@@ -1,21 +1,15 @@
 ---
 title: pointer-events
 slug: Web/CSS/pointer-events
-tags:
-  - CSS
-  - Propriété
-  - Reference
-  - SVG
 translation_of: Web/CSS/pointer-events
+browser-compat: css.properties.pointer-events
 ---
 {{CSSRef}}
 
-La propriété CSS** `pointer-events`** permet aux auteurs de contrôler les circonstances dans lesquelles un élément graphique peut être [une cible](/fr/docs/Web/API/Event/target), c'est-à-dire recevoir des événements de la souris, du pointeur ou du doigt.
+La propriété [CSS](fr/docs/Web/CSS) **`pointer-events`** permet de contrôler les circonstances dans lesquelles un élément graphique peut être [une cible](/fr/docs/Web/API/Event/target), c'est-à-dire recevoir des évènements de la souris, du pointeur ou du doigt.
 
 {{EmbedInteractiveExample("pages/css/pointer-events.html")}}
 
-Lorsque cette propriété n'est pas définie,  pour le contenu SVG, on aura le même effet qu'avec la valeur `visiblePainted`. Lorsqu'on utilise la valeur `none`, cela indique que l'élément ne peut pas recevoir d'événement de pointeur mais cela indique également qu'on peut passer « au travers » de l'élément pour atteindre des contrôles qui pourraient être en-dessous/derrière.
-
 ## Syntaxe
 
 ```css
@@ -34,6 +28,7 @@ pointer-events: all;            /* SVG uniquement */
 /* Valeurs globales */
 pointer-events: inherit;
 pointer-events: initial;
+pointer-events: revert;
 pointer-events: unset;
 ```
 
@@ -46,79 +41,95 @@ La propriété `pointer-events` est définie grâce à un mot-clé parmi ceux de
 - `none`
   - : L'élément ne sera jamais [la cible](/fr/docs/Web/API/Event/target) d'événements de pointeur. Toutefois, les événements peuvent atteindre les éléments qui sont des descendants si ceux-ci ont une autre valeur pour `pointer-events`. Sous ces circonstances, les événements déclencheront les gestionnaires d'événement sur l'élément parent jusqu'à/depuis l'élément descendant lors de la phase de capture/[bouillonnement](/fr/docs/Web/API/Event/bubbles) de l'événement.
 
-#### Valeurs uniquement utilisables avec SVG
+#### Valeurs uniquement utilisables avec SVG (expérimentales en HTML)
 
 - `visiblePainted`
-  - : L'élément ne peut être la cible d'un événement de pointeur que si la propriété `visibility` vaut `visible` et lorsque le pointeur est au-dessus de l'intérieur de l'élément et que la valeur de la propriété `fill` n'est pas `none` ou lorsque le pointeur de la souris est au-dessus du contour de l'élément et que la valeur de la propriété `stroke` n'est pas `none`.
+  - : SVG uniquement (expérimental en HTML). L'élément ne peut être la cible d'un événement de pointeur que si la propriété `visibility` vaut `visible` et lorsque le pointeur est au-dessus de l'intérieur de l'élément et que la valeur de la propriété `fill` n'est pas `none` ou lorsque le pointeur de la souris est au-dessus du contour de l'élément et que la valeur de la propriété `stroke` n'est pas `none`.
 - `visibleFill`
-  - : L'élément ne peut être la cible d'un événement de pointeur que si la propriété `visibility` vaut `visible` et lorsque le pointeur est au-dessus de l'intérieur de l'élément. La valeur de la propriété `fill` n'a pas d'impact sur le traitement des événements.
+  - : SVG uniquement. L'élément ne peut être la cible d'un événement de pointeur que si la propriété `visibility` vaut `visible` et lorsque le pointeur est au-dessus de l'intérieur de l'élément. La valeur de la propriété `fill` n'a pas d'impact sur le traitement des événements.
 - `visibleStroke`
-  - : L'élément ne peut être la cible d'un événement de pointeur que si la propriété `visibility` vaut `visible` et lorsque le pointeur de la souris est au-dessus du contour de l'élément. La valeur de la propriété `stroke` n'a pas d'impact sur le traitement des événements.
+  - : SVG uniquement. L'élément ne peut être la cible d'un événement de pointeur que si la propriété `visibility` vaut `visible` et lorsque le pointeur de la souris est au-dessus du contour de l'élément. La valeur de la propriété `stroke` n'a pas d'impact sur le traitement des événements.
 - `visible`
-  - : L'élément ne peut être la cible d'un événement de pointeur que si la propriété `visibility` vaut `visible` et lorsque le pointeur est au-dessus de l'intérieur de l'élément ou lorsque le pointeur de la souris est au-dessus du contour de l'élément. Les valeurs de `fill` et `stroke` n'ont pas d'impact sur le traitement des événements.
+  - : SVG uniquement (expérimental en HTML). L'élément ne peut être la cible d'un événement de pointeur que si la propriété `visibility` vaut `visible` et lorsque le pointeur est au-dessus de l'intérieur ou du contour de l'élément. Les valeurs de `fill` et `stroke` n'ont pas d'impact sur le traitement des événements.
 - `painted`
-  - : L'élément ne peut être la cible d'un événement de pointeur que lorsque le pointeur est au-dessus de l'intérieur de l'élément et que la valeur de la propriété `fill` n'est pas `none` ou lorsque le pointeur de la souris est au-dessus du contour de l'élément et que la valeur de la propriété `stroke` n'est pas `none`. La valeur de `visibility` n'a pas d'impact sur le traitement des événements.
+  - : SVG uniquement (expérimental en HTML). L'élément ne peut être la cible d'un événement de pointeur que lorsque le pointeur est au-dessus de l'intérieur de l'élément et que la valeur de la propriété `fill` n'est pas `none` ou lorsque le pointeur de la souris est au-dessus du contour de l'élément et que la valeur de la propriété `stroke` n'est pas `none`. La valeur de `visibility` n'a pas d'impact sur le traitement des événements.
 - `fill`
-  - : L'élément ne peut être la cible d'un événement de pointeur que lorsque le pointeur est au-dessus de l'intérieur de l'élément. Les valeurs de `fill` et de `visibility` n'ont pas d'impact sur le traitement des événements.
+  - : SVG uniquement. L'élément ne peut être la cible d'un événement de pointeur que lorsque le pointeur est au-dessus de l'intérieur de l'élément. Les valeurs de `fill` et de `visibility` n'ont pas d'impact sur le traitement des événements.
 - `stroke`
-  - : L'élément ne peut être la cible d'un événement de pointeur que lorsque le pointeur est au-dessus du contour de l'élément. Les valeurs de `stroke` et de `visibility` n'ont pas d'impact sur le traitement des événements.
+  - : SVG uniquement. L'élément ne peut être la cible d'un événement de pointeur que lorsque le pointeur est au-dessus du contour de l'élément. Les valeurs de `stroke` et de `visibility` n'ont pas d'impact sur le traitement des événements.
 - `all`
-  - : L'élément ne peut être la cible d'un événement de pointeur que lorsque le pointeur est au-dessus de l'intérieur de l'élément ou lorsque le pointeur de la souris est au-dessus du contour de l'élément. Les valeurs de `fill`, `stroke` et de `visibility` n'ont pas d'impact sur le traitement des événements.
+  - : SVG uniquement (expérimental en HTML). L'élément ne peut être la cible d'un événement de pointeur que lorsque le pointeur est au-dessus de l'intérieur ou du contour de l'élément. Les valeurs de `fill`, de `stroke` et de `visibility` n'ont pas d'impact sur le traitement des événements.
+
+## Description
+
+Lorsque cette propriété n'est pas définie pour le contenu SVG, on aura le même effet qu'avec la valeur `visiblePainted`. 
+
+Lorsqu'on utilise la valeur `none`, cela indique que l'élément ne peut pas recevoir d'événement de pointeur mais également qu'on peut passer «&nbsp;au travers&nbsp;» de l'élément pour atteindre des contrôles qui pourraient être «&nbsp;en dessous/derrière&nbsp;».
+
+L'utilisation de `pointer-events` peut empêcher que des événements soient directement déclenchés sur l'élément avec les pointeurs. Cela *ne signifie en aucun cas* que les gestionnaires d'événement de cet élément ne pourront pas être déclenchés&nbsp;! Si l'un des éléments descendants possède une valeur explicite de `pointer-events` qui lui *permet* de recevoir des événements de pointeur, les événements qui parcourent les ancêtres pourront déclencher les gestionnaires d'événements associés. Bien entendu, tout pointage qui a lieu sur un endroit de l'écran qui est couvert par le parent, mais pas par l'élément descendant, ne déclenchera pas d'événement. L'événement passera «&nbsp;au travers&nbsp;» du parent et ciblera le contenu qui est en dessous.
+
+Les éléments avec `pointer-events: none` continueront de recevoir le focus via la navigation au clavier avec la touche <kbd>Tab</kbd>.
+
+## Définition formelle
+
+{{CSSInfo}}
 
-### Syntaxe formelle
+## Syntaxe formelle
 
 {{csssyntax}}
 
 ## Exemples
 
-Dans l'exemple qui suit, on rend le lien http\://exemple.com inactif.
+### Désactiver les événements de pointeur pour toutes les images
 
-### HTML
+Dans l'exemple qui suit, on désactive les événements de pointeur (cliquer, glisser, survoler, etc.) pour toutes les images.
+
+```css
+img {
+  pointer-events: none;
+}
+```
+
+### Désactiver les événements de pointeur pour un lien
+
+Dans l'exemple qui suit, on désactive les événements de pointeur pour le lien http\://example.com.
+
+#### HTML
 
 ```html
 <ul>
   <li><a href="https://developer.mozilla.org">MDN</a></li>
-  <li><a href="http://exemple.com">exemple.com</a></li>
+  <li><a href="http://example.com">example.com</a></li>
 </ul>
 ```
 
-### CSS
+#### CSS
 
 ```css
-a[href="http://exemple.com"] {
+a[href="http://example.com"] {
   pointer-events: none;
 }
 ```
 
-### Résultat
-
-{{EmbedLiveSample('Exemples', "500", "100")}}
+#### Résultat
 
-## Notes
-
-L'utilisation de `pointer-events` peut empêcher que des événements soient directement déclenchés sur l'élément avec les pointeurs. Cela ne signifie en aucun cas que les gestionnaires d'événement de cet élément ne pourront pas être déclenchés ! Si l'un des éléments descendants possède une valeur explicite de `pointer-events` qui lui permet de recevoir des événements de pointeur, les événements qui parcourent les ancêtres pourront déclencher les gestionnaires d'événements associés. Bien entendu, tout pointage, qui a lieu sur un endroit de l'écran qui est couvert par le parent mais pas par l'élément descendant, ne déclenchera d'événement. L'événement passera au travers du parent et ciblera le contenu qui est en-dessous.
-
-Les éléments avec `pointer-events: none` continueront de recevoir le focus via la navigation au clavier avec la touche <kbd>Tab</kbd>.
+{{EmbedLiveSample('', "500", "100")}}
 
 ## Spécifications
 
-| Spécification                                                                                            | État                     | Commentaires |
-| -------------------------------------------------------------------------------------------------------- | ------------------------ | ------------ |
-| {{SpecName('SVG1.1', 'interact.html#PointerEventsProperty', 'pointer-events')}} | {{Spec2('SVG1.1')}} |              |
-| {{SpecName('SVG2', 'interact.html#PointerEventsProperty', 'pointer-events')}} | {{Spec2('SVG2')}} |              |
+{{Specifications}}
 
-L'extension de cette propriété aux éléments HTML, bien qu'elle fut présente dans les premiers brouillons de la spécification _CSS Basic User Interface Module Level 3_, a été remise à la spécification de [niveau 4](https://wiki.csswg.org/spec/css4-ui#pointer-events).
-
-{{cssinfo}}
+Bien que l'extension de `pointer-events` au contenu HTML soit incluse dans les premières ébauches du niveau 3 du module <i lang="en">CSS Basic User Interface</i>, elle a été reportée à la spécification de niveau 4.
 
 ## Compatibilité des navigateurs
 
-{{Compat("css.properties.pointer-events")}}
+{{Compat}}
 
 ## Voir aussi
 
-- L'attribut SVG {{SVGAttr("pointer-events")}}
-- L'attribut SVG {{SVGAttr("visibility")}}
-- La propriété {{cssxref("user-select")}} qui contrôle lorsque l'utilisateur peut sélectionner du texte
-- [« Spécification » WebKit pour étendre la propriété pointer-events](https://webkit.org/specs/PointerEventsProperty.html) au contenu (X)HTML
-- [Un défilement à 60fps en utilisant `pointer-events: none` (en anglais)](http://www.thecssninja.com/javascript/pointer-events-60fps)
+- L'attribut SVG [`pointer-events`](/fr/docs/Web/SVG/Attribute/pointer-events)
+- L'attribut SVG [`visibility`](/fr/docs/Web/SVG/Attribute/visibility)
+- [Spécification WebKit pour étendre la propriété `pointer-events` (en anglais)](https://webkit.org/specs/PointerEventsProperty.html) au contenu (X)HTML
+- La propriété [`user-select`](/fr/docs/Web/CSS/user-select) qui contrôle lorsque l'utilisateur peut sélectionner du texte
+- [La page du wiki de Mozilla pour recenser les cas d'usage nécessitant l'extension des valeurs implémentées pour HTML](https://wiki.mozilla.org/SVG:pointer-events)
+
diff --git a/files/fr/web/css/scroll-behavior/index.md b/files/fr/web/css/scroll-behavior/index.md
index 486f6a44f5..8e904df117 100644
--- a/files/fr/web/css/scroll-behavior/index.md
+++ b/files/fr/web/css/scroll-behavior/index.md
@@ -1,22 +1,18 @@
 ---
 title: scroll-behavior
 slug: Web/CSS/scroll-behavior
-tags:
-  - CSS
-  - CSSOM
-  - Propriété
-  - Reference
 translation_of: Web/CSS/scroll-behavior
+browser-compat: css.properties.scroll-behavior
 ---
 {{CSSRef}}
 
-La propriété** `scroll-behavior`** définit le comportement du défilement pour une boîte de défilement lorsque celui-ci provient de la navigation ou des API CSSOM.
-
-Pour les autres défilements, appliqués par l'utilisateur, cette propriété n'a aucun impact. Lorsque cette propriété est définie sur l'élément racine, elle s'applique à la zone d'affichage (_viewport_).
+La propriété **`scroll-behavior`** définit le comportement du défilement pour une boîte de défilement lorsque celui-ci provient de la navigation ou des API CSSOM.
 
 {{EmbedInteractiveExample("pages/css/scroll-behavior.html")}}
 
-Les agents utilisateur peuvent choisir d'ignorer cette propriété. Lorsque cette propriété est indiquée sur l'élément `body`, elle ne se propage pas à la zone d'affichage (_viewport_).
+Pour les autres défilements, tels que ceux appliqués par l'utilisateur, cette propriété n'a aucun impact. Lorsque cette propriété est définie sur l'élément racine, elle s'applique à la zone d'affichage (<i lang="en">viewport</i>). Lorsque cette propriété est indiquée sur l'élément `body`, elle *ne se propage pas* à la zone d'affichage (<i lang="en">viewport</i>).
+
+Les agents utilisateur peuvent choisir d'ignorer cette propriété.
 
 ## Syntaxe
 
@@ -28,6 +24,7 @@ scroll-behavior: smooth;
 /* Valeurs globales */
 scroll-behavior: inherit;
 scroll-behavior: initial;
+scroll-behavior: revert;
 scroll-behavior: unset;
 ```
 
@@ -38,40 +35,63 @@ La propriété `scroll-behavior` est définie avec l'un des mots-clés suivants.
 - `auto`
   - : La boîte de défilement progresse de façon instantanée.
 - `smooth`
-  - : Le défilement est doux et utilise une fonction de minutage définie par l'agent utilisateur pendant une période définie par l'agent utilisateur. Les agents utilisateur doivent respecter les conventions de la plate-forme s'il y en a.
+  - : Le défilement est doux et utilise une fonction de minutage définie par l'agent utilisateur pendant une période définie par l'agent utilisateur. Les agents utilisateur doivent respecter les conventions de la plateforme s'il y en a.
+
+## Définition formelle
 
-### Syntaxe formelle
+{{CSSInfo}}
+
+## Syntaxe formelle
 
 {{csssyntax}}
 
 ## Exemples
 
-### CSS
+### Définition d'un défilement doux
+
+#### HTML
 
+```html
+<nav>
+  <a href="#page-1">1</a>
+  <a href="#page-2">2</a>
+  <a href="#page-3">3</a>
+</nav>
+<div class="scroll-container">
+  <div class="scroll-page" id="page-1">1</div>
+  <div class="scroll-page" id="page-2">2</div>
+  <div class="scroll-page" id="page-3">3</div>
+</div>
+```
+
+#### CSS
 ```css
 a {
   display: inline-block;
   width: 50px;
   text-decoration: none;
 }
-nav, scroll-container {
+
+nav, .scroll-container {
   display: block;
   margin: 0 auto;
   text-align: center;
 }
+
 nav {
   width: 339px;
   padding: 5px;
   border: 1px solid black;
 }
-scroll-container {
-  display: block;
+
+.scroll-container {
   width: 350px;
   height: 200px;
   overflow-y: scroll;
   scroll-behavior: smooth;
 }
-scroll-page {
+
+.scroll-page {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -80,51 +100,14 @@ scroll-page {
 }
 ```
 
-### HTML
-
-```html
-<nav>
-  <a href="#page-1">1</a>
-  <a href="#page-2">2</a>
-  <a href="#page-3">3</a>
-</nav>
-<scroll-container>
-  <scroll-page id="page-1">1</scroll-page>
-  <scroll-page id="page-2">2</scroll-page>
-  <scroll-page id="page-3">3</scroll-page>
-</scroll-container>
-```
-
-### Résultat
-
-{{EmbedLiveSample("Exemples", "100%", 250)}}
-
-## Accessibilité
+#### Résultat
 
-[Les troubles du système vestibulaires](https://fr.wikipedia.org/wiki/Syst%C3%A8me_vestibulaire) peuvent être causés par la maladie, l'âge ou des blessures. Ces troubles entraînent des vertiges, fatigues et nausées suite aux mouvements.
-
-En utilisant la caractéristique média `prefers-reduced-motion`, on peut désactiver le défilement instantanné pour les utilisateurs qui ont paramétré leur système/navigateur afin de réduire les animations et mouvements :
-
-```css
-html {
-  scroll-behavior: smooth;
-}
-
-@media (prefers-reduced-motion: reduce) {
-  html {
-    scroll-behavior: auto;
-  }
-}
-```
+{{EmbedLiveSample("", "100%", 250)}}
 
 ## Spécifications
 
-| Spécification                                                                                    | État                             | Commentaires         |
-| ------------------------------------------------------------------------------------------------ | -------------------------------- | -------------------- |
-| {{SpecName('CSSOM View', "#propdef-scroll-behavior", 'scroll-behavior')}} | {{Spec2('CSSOM View')}} | Définition initiale. |
-
-{{cssinfo}}
+{{Specifications}}
 
 ## Compatibilité des navigateurs
 
-{{Compat("css.properties.scroll-behavior")}}
+{{Compat}}