Fixes #2842 - Fixing EmbedLiveSample errors for fr docs (#2851)

* Fixes #2842 for CSS pages

* Fixes #2842 for Web API pages

* Fixes #2842 for other sections

* Fix EmbedLiveSample for moved CSS page

* Fixes #2842 for conflicting / orphaned docs

8 files changed, 18 insertions, 55 deletions

diff --git a/files/fr/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.md b/files/fr/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.md
index ebb8984bf0..3975a675e2 100644
--- a/files/fr/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.md
+++ b/files/fr/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.md
@@ -1,12 +1,6 @@
 ---
 title: Les concepts de base des grilles CSS
 slug: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
-tags:
-  - CSS
-  - CSS Grids
-  - Grilles CSS
-  - Guide
-  - Intermédiaire
 translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
 original_slug: Web/CSS/CSS_Grid_Layout/Les_concepts_de_base
 ---
@@ -135,7 +129,7 @@ Nous avons créé une grille avec trois pistes de 200 pixels de large. Chaque é
 }
 ```
 
-{{ EmbedLiveSample('grid_first', '610', '140') }}
+{{ EmbedLiveSample('Les_pistes', '610', '140') }}
 
 ### L'unité fr
 
diff --git a/files/fr/web/css/css_grid_layout/box_alignment_in_css_grid_layout/index.md b/files/fr/web/css/css_grid_layout/box_alignment_in_css_grid_layout/index.md
index 3a3d192874..2ae251e3d2 100644
--- a/files/fr/web/css/css_grid_layout/box_alignment_in_css_grid_layout/index.md
+++ b/files/fr/web/css/css_grid_layout/box_alignment_in_css_grid_layout/index.md
@@ -1,12 +1,6 @@
 ---
 title: L'alignement des boîtes avec les grilles CSS
 slug: Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout
-tags:
-  - CSS
-  - CSS Grid
-  - Grille CSS
-  - Guides
-  - Intermédiaire
 translation_of: Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout
 original_slug: Web/CSS/CSS_Grid_Layout/Alignement_des_boîtes_avec_les_grilles_CSS
 ---
@@ -102,7 +96,7 @@ Dans l'exemple suivant, on a quatre zones sur la grille. On peut utiliser la pro
 </div>
 ```
 
-{{EmbedLiveSample('utiliser_align-items', '500', '450')}}
+{{EmbedLiveSample('Utiliser_align-items', '500', '450')}}
 
 Lorsqu'on utilise `align-self: start`, la hauteur de chaque `<div>` sera déterminée par le contenu du `<div>`. En revanche, si on n'utilise pas {{cssxref("align-self")}}, chaque `<div>` sera étiré afin de remplir la zone de la grille.
 
@@ -168,7 +162,7 @@ Dans le prochain exemple, on utilise la propriété `align-self` afin d'illustre
 </div>
 ```
 
-{{EmbedLiveSample('utiliser_align-self', '500', '450')}}
+{{EmbedLiveSample('Utiliser_align-self', '500', '450')}}
 
 ### Gestion des objets avec un ratio intrinsèque
 
@@ -250,9 +244,7 @@ Là encore, la valeur par défaut `stretch` pour les objets qui n'ont pas de rat
 </div>
 ```
 
-Justifier_les_objets_sur_laxe_en_ligne_inline_axis
-
-{{EmbedLiveSample('alignment_3', '500', '450')}}
+{{EmbedLiveSample('Justifier_les_objets_sur_laxe_en_ligne_inline_axis', '500', '450')}}
 
 Comme pour {{cssxref("align-self")}} et {{cssxref("align-items")}}, on peut utiliser la propriété {{cssxref("justify-items")}} sur le conteneur de la grille afin de régler la valeur de {{cssxref("justify-self")}} pour l'ensemble des objets de la grille.
 
@@ -389,7 +381,7 @@ La propriété `align-content` s'applique sur le conteneur de la grille car elle
 </div>
 ```
 
-{{EmbedLiveSample('alignement_par_defaut', '500', '520')}}
+{{EmbedLiveSample('Alignement_par_défaut', '500', '520')}}
 
 ### Utiliser align-content: end
 
@@ -450,7 +442,7 @@ Si on ajoute `align-content` avec la valeur `end` sur le conteneur, les pistes s
 </div>
 ```
 
-{{EmbedLiveSample('align-content_end', '500', '520')}}
+{{EmbedLiveSample('Utiliser_align-content_end', '500', '520')}}
 
 ### Utiliser align-content: space-between
 
@@ -511,7 +503,7 @@ Pour cette propriété, on peut également utiliser des valeurs qu'on manipule a
 </div>
 ```
 
-{{EmbedLiveSample('align-content_end_space-between', '500', '1570')}}
+{{EmbedLiveSample('Utiliser_align-content_space-between', '500', '1570')}}
 
 On notera qu'en utilisant ces valeurs pour répartir l'espace, cela peut agrandir les objets de la grille. Si un objet s'étale sur plusieurs pistes, un espace sera ajouté entre chaque piste afin que l'objet qui doit être agrandi puisse absorber cet espace. Aussi, si vous choisissez d'utiliser ces valeurs, assurez-vous que le contenu des pistes puisse absorber cet espace supplémentaire ou que les propriétés d'alignement les renvoient au début de la piste plutôt que de les étirer.
 
diff --git a/files/fr/web/css/css_grid_layout/css_grid_and_progressive_enhancement/index.md b/files/fr/web/css/css_grid_layout/css_grid_and_progressive_enhancement/index.md
index 6291e0ad41..2bddcda1bb 100644
--- a/files/fr/web/css/css_grid_layout/css_grid_and_progressive_enhancement/index.md
+++ b/files/fr/web/css/css_grid_layout/css_grid_and_progressive_enhancement/index.md
@@ -1,12 +1,6 @@
 ---
 title: Les grilles CSS et l'amélioration progressive
 slug: Web/CSS/CSS_Grid_Layout/CSS_Grid_and_Progressive_Enhancement
-tags:
-  - CSS
-  - CSS Grids
-  - Grilles CSS
-  - Guide
-  - Intermédiaire
 translation_of: Web/CSS/CSS_Grid_Layout/CSS_Grid_and_Progressive_Enhancement
 original_slug: Web/CSS/CSS_Grid_Layout/Les_grilles_CSS_et_l_amélioration_progressive
 ---
@@ -182,7 +176,7 @@ Dans le prochain exemple, nous aurons un ensemble de cartes disposées avec du f
 </div>
 ```
 
-{{EmbedLiveSample('un_exemple_plus_complexe', '550', '400')}}
+{{EmbedLiveSample('Un_exemple_plus_complexe', '550', '400')}}
 
 Dans la capture qui suit, on voit un problème classique qui est causé par les dispositions flottantes : si on ajoute du contenu à l'une des cartes, la disposition est chamboulée.
 
@@ -291,7 +285,7 @@ On utilise donc `@supports` pour vérifier la prise en charge de `display: grid`
 </div>
 ```
 
-{{EmbedLiveSample('une_solution_avec_les_requetes_de_fonctionnalité', '550', '480')}}
+{{EmbedLiveSample('Une_solution_avec_les_requêtes_de_fonctionnalité', '550', '480')}}
 
 ## Surcharger les autres valeurs pour `display`
 
diff --git a/files/fr/web/css/css_grid_layout/css_grid_logical_values_and_writing_modes/index.md b/files/fr/web/css/css_grid_layout/css_grid_logical_values_and_writing_modes/index.md
index 9cf0afc469..f22c645dc6 100644
--- a/files/fr/web/css/css_grid_layout/css_grid_logical_values_and_writing_modes/index.md
+++ b/files/fr/web/css/css_grid_layout/css_grid_logical_values_and_writing_modes/index.md
@@ -1,12 +1,6 @@
 ---
 title: Les grilles CSS, les valeurs logiques et les modes d'écriture
 slug: Web/CSS/CSS_Grid_Layout/CSS_Grid_Logical_Values_and_Writing_Modes
-tags:
-  - CSS
-  - CSS Grids
-  - Grilles CSS
-  - Guides
-  - Intermédiaire
 translation_of: Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Modes
 original_slug: >-
   Web/CSS/CSS_Grid_Layout/Les_grilles_CSS_les_valeurs_logiques_les_modes_d_écriture
@@ -184,7 +178,7 @@ Si on ajoute `writing-mode: vertical-lr` au conteneur de la grille, on peut voir
 </div>
 ```
 
-{{EmbedLiveSample("definir_writing-mode", '500', '330')}}
+{{EmbedLiveSample("Définir_writing-mode", '500', '330')}}
 
 ![A image showing the direction of Block and Inline when writing-mode is vertical-lr](8-vertical-lr.png)
 
@@ -313,7 +307,7 @@ Dans l'exemple suivant, on a une grille avec la direction `ltr` et on positionne
 </div>
 ```
 
-{{EmbedLiveSample("placement_sur_les_lignes_pour_du_texte_de_gauche_à_droite", '500', '330')}}
+{{EmbedLiveSample("Placement_sur_les_lignes_pour_du_texte_de_gauche_à_droite", '500', '330')}}
 
 ### Placement sur les lignes pour du texte de droite à gauche
 
@@ -365,7 +359,7 @@ Si on ajoute alors la propriété {{cssxref("direction")}} avec la valeur `rtl`
 </div>
 ```
 
-{{EmbedLiveSample("placement_sur_les_lignes_pour_du_texte_de_droite_à_gauche", '500', '330')}}
+{{EmbedLiveSample("Placement_sur_les_lignes_pour_du_texte_de_droite_à_gauche", '500', '330')}}
 
 On voit ici que si on change la direction du texte pour la page ou pour une partie de la page : la disposition change selon lees numéros de lignes. Si on ne veut pas que les lignes bougent, on pourra utiliser des lignes nommées pour éviter cet effet.
 
diff --git a/files/fr/web/css/css_grid_layout/grid_template_areas/index.md b/files/fr/web/css/css_grid_layout/grid_template_areas/index.md
index b340f23c01..aba4861212 100644
--- a/files/fr/web/css/css_grid_layout/grid_template_areas/index.md
+++ b/files/fr/web/css/css_grid_layout/grid_template_areas/index.md
@@ -1,11 +1,6 @@
 ---
 title: Définir des zones sur une grille
 slug: Web/CSS/CSS_Grid_Layout/Grid_Template_Areas
-tags:
-  - CSS
-  - CSS Grids
-  - Grilles CSS
-  - Guide
 translation_of: Web/CSS/CSS_Grid_Layout/Grid_Template_Areas
 original_slug: Web/CSS/CSS_Grid_Layout/Définir_des_zones_sur_une_grille
 ---
@@ -232,7 +227,7 @@ La zone qu'on crée avec les noms doit être rectangulaires. Actuellement, il n'
 
 La valeur utilisée pour {{cssxref("grid-template-areas")}} doit obligatoirement décrire une grille complète, sinon elle est considérée invalide et la propriété est ignorée. Cela signifie qu'il faut le même nombre de cellules pour chaque ligne (si une cellule est vide, on l'indiquera avec un point). Si des zones ne sont pas rectangulaires, cela sera également considéré comme invalide.
 
-## Redéfinir une grille à avec des _media queries_
+## Redéfinir une grille avec des _media queries_
 
 Notre disposition fait désormais partie de notre feuille de style CSS. On peut donc l'adapter très facilement pour différentes résolutions. On peut redéfinir la position des objets sur la grille ou la grille elle-même, ou les deux simultanément.
 
diff --git a/files/fr/web/css/css_grid_layout/layout_using_named_grid_lines/index.md b/files/fr/web/css/css_grid_layout/layout_using_named_grid_lines/index.md
index 4b6a3c350d..73115758da 100644
--- a/files/fr/web/css/css_grid_layout/layout_using_named_grid_lines/index.md
+++ b/files/fr/web/css/css_grid_layout/layout_using_named_grid_lines/index.md
@@ -286,7 +286,7 @@ On peut également utiliser le mot-clé `span`. Avec la règle suivante, le deux
 </div>
 ```
 
-{{EmbedLiveSample("une_grille_à_12_colonnes_avec_repeat", '500', '330')}}
+{{EmbedLiveSample("Une_grille_à_12_colonnes_avec_repeat", '500', '330')}}
 
 Si vous observez cette disposition grâce à l'outil de mise en évidence des grilles dans Firefox, vous verrez les différentes lignes et le placement des éléments sur ces lignes :
 
@@ -426,7 +426,7 @@ Pour placer ces éléments, on utilise la grille de la façon suivante :
 }
 ```
 
-{{ EmbedLiveSample('cadre_d_une_grille_à_12_colonnes', '500', '330') }}
+{{ EmbedLiveSample('Cadre_dune_grille_à_12_colonnes', '500', '330') }}
 
 Là encore, l'outil de mise en évidence de la grille permet de voir comment le placement fonctionne :
 
diff --git a/files/fr/web/css/css_grid_layout/realizing_common_layouts_using_css_grid_layout/index.md b/files/fr/web/css/css_grid_layout/realizing_common_layouts_using_css_grid_layout/index.md
index 2bfa068958..50b9b76b05 100644
--- a/files/fr/web/css/css_grid_layout/realizing_common_layouts_using_css_grid_layout/index.md
+++ b/files/fr/web/css/css_grid_layout/realizing_common_layouts_using_css_grid_layout/index.md
@@ -1,12 +1,6 @@
 ---
 title: Construire des dispositions courantes avec des grilles CSS
 slug: Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_Layout
-tags:
-  - CSS
-  - CSS Grids
-  - Grilles CSS
-  - Guide
-  - Intermédiaire
 translation_of: Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_Layout
 original_slug: >-
   Web/CSS/CSS_Grid_Layout/Construire_des_dispositions_courantes_avec_des_grilles_CSS
@@ -550,7 +544,7 @@ h2 {
 }
 ```
 
-{{EmbedLiveSample('empecher_les_espaces_avec_dense', '800', '900')}}
+{{EmbedLiveSample('Empêcher_les_espaces_avec_dense', '800', '900')}}
 
 Cette technique de placement automatiquement peut s'avérer extrêmement utile si vous devez gérer du contenu produit par un CMS pour un ensemble d'objets qui se ressemblent et auxquels vous ajoutez une classe lors de la génération en HTML.
 
diff --git a/files/fr/web/css/css_grid_layout/relationship_of_grid_layout/index.md b/files/fr/web/css/css_grid_layout/relationship_of_grid_layout/index.md
index 5272f1bbdb..b02c8290f6 100644
--- a/files/fr/web/css/css_grid_layout/relationship_of_grid_layout/index.md
+++ b/files/fr/web/css/css_grid_layout/relationship_of_grid_layout/index.md
@@ -510,7 +510,7 @@ Si on utilise `display:` `contents` sur un élément, la boîte qu'il aurait nor
 }
 ```
 
-{{EmbedLiveSample('utiliser_display_contents_avant', '400', '420')}}
+{{EmbedLiveSample('Utiliser_display_contents_avant', '400', '420')}}
 
 ### Utiliser display contents après
 
@@ -567,7 +567,7 @@ Si on ajoute `display:` `contents` aux règles qui ciblent `box1`, la boîte de
 }
 ```
 
-{{EmbedLiveSample('utiliser_display_contents_après', '400', '330')}}
+{{EmbedLiveSample('Utiliser_display_contents_après', '400', '330')}}
 
 Cela permet que des éléments imbriqués agissent comme s'ils faisaient partie de la grille. C'est également une méthode de contournement pour certains problèmes qui seront résolus par les « sous-grilles » (_subgrids_) lorsqu'elles seront implémentées. Vous pouvez également utiliser `display:` `contents` de façon similaire avec les boîtes flexibles afin que les éléments imbriqués deviennent des éléments flexibles.