diff options
author | SphinxKnight <SphinxKnight@users.noreply.github.com> | 2022-03-16 17:52:18 +0100 |
---|---|---|
committer | GitHub <noreply@github.com> | 2022-03-16 17:52:18 +0100 |
commit | 500f444d23a7a758da229ebe6b9691cc5d4fe731 (patch) | |
tree | ca277561f7f3c5f2c9c3e80a895ac32f30852238 /files/fr/web/css/css_grid_layout | |
parent | de831e4687986c3a60b9ced69ce9faefda8df4b9 (diff) | |
download | translated-content-500f444d23a7a758da229ebe6b9691cc5d4fe731.tar.gz translated-content-500f444d23a7a758da229ebe6b9691cc5d4fe731.tar.bz2 translated-content-500f444d23a7a758da229ebe6b9691cc5d4fe731.zip |
Fix #4269 - Removes empty/special characters (#4270)
* Remove ufeff
* Remove u2064
* Remove u2062
* Replace u202f followed by : with :
* Replace u202f next to « or » with and « or »
* Replace u202f followed by ; with ;
* Replace u202f followed by ! with
* Replace u202f followed by ? with ?
* Replace remaining u202f with classical space
* Replace u200b surrounded by space with classical space
* Replace u200b surrounded by space with classical space - again (repeated)
* Remove remaining u200b
* Remove u200a
* Replace u2009 with
* Remove u00ad
* Replace u00a0 followed by : ! or ? with and punctuation
* Replace u00a0 surrounded « or » with and punctuation
* Replace u00a0 followed by whitespaces
* Replace u00a0 preceded by whitespaces
* Replace u00a0 followed by a newline with a newline
* Replace u00a0 followed by a newline with a newline - Take2
* Replace u00a0 followed by a ; and punctuation
* Remove u00a0 followed by ,
* Remove u00a0 in indentation spaces with \n([ ]*)([\u00a0])([ ]*)
* Manual replacement of ([\u00a0])([ ]+)
* Replace remaining ([\u00a0]+) by a space
* cleaning empty elements
* remove ufe0f
* Remove u00a0 and u202f after merging against updated main
* remove double whitespace using (\w)( )(\w)
Diffstat (limited to 'files/fr/web/css/css_grid_layout')
7 files changed, 28 insertions, 28 deletions
diff --git a/files/fr/web/css/css_grid_layout/auto-placement_in_css_grid_layout/index.md b/files/fr/web/css/css_grid_layout/auto-placement_in_css_grid_layout/index.md index 119d3ec21a..860c6c8a43 100644 --- a/files/fr/web/css/css_grid_layout/auto-placement_in_css_grid_layout/index.md +++ b/files/fr/web/css/css_grid_layout/auto-placement_in_css_grid_layout/index.md @@ -133,13 +133,13 @@ On peut utiliser la fonction {{cssxref("minmax","minmax()")}} pour la valeur de <div>Deux</div> <div>Trois</div> <div>Quatre - <br>Cette cellule - <br>a du contenu - <br>supplémentaire - <br>et max vaut auto - <br>afin que la ligne + <br>Cette cellule + <br>a du contenu + <br>supplémentaire + <br>et max vaut auto + <br>afin que la ligne <br>se développe. - </div> + </div> <div>Five</div> </div> ``` @@ -256,7 +256,7 @@ Une grille peut contenir un mélange d'éléments. Certains éléments peuvent a ### Modification de l'ordre du document -Le placement des éléments qui n'ont pas eu d'ordre défini sont placés selon l'algorithme décrit dans la section _“order modified document order”_. Cela signifie que si on utilise uniquement la propriété `order`, les éléments seront placés selon cet ordre plutôt que selon l'ordre indiqué par le DOM. Sinon, l'ordre des éléments sera celui décrit par le document source. +Le placement des éléments qui n'ont pas eu d'ordre défini sont placés selon l'algorithme décrit dans la section _“order modified document order”_. Cela signifie que si on utilise uniquement la propriété `order`, les éléments seront placés selon cet ordre plutôt que selon l'ordre indiqué par le DOM. Sinon, l'ordre des éléments sera celui décrit par le document source. ### Les éléments avec des propriétés de placement @@ -508,7 +508,7 @@ Le placement automatique peut être utile lorsqu'on a un ensemble d'objets qui s {{EmbedLiveSample('Les_cas_dutilisation_pour_le_placement_automatique', '500', '1300')}} -Le placement automatique peut également aider à disposer des éléments d'interface utilisateur qui ont un ordre logique. Dans l'exemple suivant, on voit comment manipuler les listes de définition. Les listes de définition sont intéressantes car il n'y a pas de niveau de regroupement pour regrouper un terme et ses définitions. Dans cet exemple, on autorise le placement automatique mais on a une classe pour qu'un élément `dt` démarre sur la première ligne et que l'élément `dd` sur la ligne 2. On s'assure ainsi que les termes sont bien en face de chaque définition, peu importe le nombre de définitions qu'on a pour un terme. +Le placement automatique peut également aider à disposer des éléments d'interface utilisateur qui ont un ordre logique. Dans l'exemple suivant, on voit comment manipuler les listes de définition. Les listes de définition sont intéressantes car il n'y a pas de niveau de regroupement pour regrouper un terme et ses définitions. Dans cet exemple, on autorise le placement automatique mais on a une classe pour qu'un élément `dt` démarre sur la première ligne et que l'élément `dd` sur la ligne 2. On s'assure ainsi que les termes sont bien en face de chaque définition, peu importe le nombre de définitions qu'on a pour un terme. ### Autre exemple 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 2ae251e3d2..d38377a622 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 @@ -14,7 +14,7 @@ Chaque méthode de disposition qui implémente cette nouvelle spécification se ## Les deux axes d'une grille -Lorsqu'on manipule une grille, on dispose de deux axes sur lesquels aligner les objets. L'axe de bloc et l'axe en ligne. L'axe de bloc est l'axe selon lequel les blocs sont disposés quand on a une disposition en bloc (_block layout_). Par exemple, si on a deux paragraphes sur une page, par défaut, ils s'affichent l'un en dessous de l'autre. +Lorsqu'on manipule une grille, on dispose de deux axes sur lesquels aligner les objets. L'axe de bloc et l'axe en ligne. L'axe de bloc est l'axe selon lequel les blocs sont disposés quand on a une disposition en bloc (_block layout_). Par exemple, si on a deux paragraphes sur une page, par défaut, ils s'affichent l'un en dessous de l'autre. ![](7_block_axis.png) 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 2bddcda1bb..19cbf7d487 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 @@ -206,7 +206,7 @@ Les requêtes de fonctionnalité ressemblent beaucoup aux [requêtes de média]( La prise en charge des requêtes de fonctionnalité par les différents navigateurs est excellente. Tous les navigateurs qui prennent en charge la nouvelle spécification pour les grilles CSS supportent aussi les requêtes de fonctionnalité. On peut donc les utiliser pour résoudre le problème précédent pour améliorer la disposition flottante. -On utilise donc `@supports` pour vérifier la prise en charge de `display: grid`;, ensuite on indique que {{HTMLElement("ul")}} est le conteneur de la grille, on définit la largeur et {{cssxref("min-height")}} avec `auto` pour les éléments {{HTMLElement("li")}}. On retire également les marges, les marges négatives et on remplace l'espacement avec la propriété {{cssxref("gap")}}. Cela signifie qu'il n'y aura pas de marge finale sur la dernière ligne de boîtes. La disposition fonctionne également désormais lorsqu'une carte possède plus de contenu qu'une autre. +On utilise donc `@supports` pour vérifier la prise en charge de `display: grid`;, ensuite on indique que {{HTMLElement("ul")}} est le conteneur de la grille, on définit la largeur et {{cssxref("min-height")}} avec `auto` pour les éléments {{HTMLElement("li")}}. On retire également les marges, les marges négatives et on remplace l'espacement avec la propriété {{cssxref("gap")}}. Cela signifie qu'il n'y aura pas de marge finale sur la dernière ligne de boîtes. La disposition fonctionne également désormais lorsqu'une carte possède plus de contenu qu'une autre. ```css hidden * {box-sizing: border-box;} 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 f22c645dc6..8290c60297 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 @@ -95,7 +95,7 @@ Si on reprend l'exemple avec la grille, on comprend mieux l'effet du changement ### Mode d'écriture par défaut -Dans le prochain exemple, la grille possède trois colonnes et deux lignes. Cela signifie qu'il y a trois pistes qui traversent l'axe de bloc. Avec le mode d'écriture par défaut, la grille commence par placer les objets en haut à gauche en remplissant les trois cellules sur la première ligne avant de passer à la suivante, en formant une nouvelle ligne, etc. +Dans le prochain exemple, la grille possède trois colonnes et deux lignes. Cela signifie qu'il y a trois pistes qui traversent l'axe de bloc. Avec le mode d'écriture par défaut, la grille commence par placer les objets en haut à gauche en remplissant les trois cellules sur la première ligne avant de passer à la suivante, en formant une nouvelle ligne, etc. ```css hidden * {box-sizing: border-box;} 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 aba4861212..faae69d8ab 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 @@ -87,9 +87,9 @@ Grâce à ces noms, on peut créer l'organisation. Cette fois, plutôt que de pl ```html <div class="wrapper"> <div class="header">En-tête</div> - <div class="sidebar">Barre latérale</div> - <div class="content">Contenu</div> - <div class="footer">Pied de page</div> + <div class="sidebar">Barre latérale</div> + <div class="content">Contenu</div> + <div class="footer">Pied de page</div> </div> ``` @@ -151,9 +151,9 @@ Dans l'exemple précédent, toute la grille est occupée… On peut également u ```html <div class="wrapper"> <div class="header">En-tête</div> - <div class="sidebar">Barre latérale</div> - <div class="content">Contenu</div> - <div class="footer">Pied de page</div> + <div class="sidebar">Barre latérale</div> + <div class="content">Contenu</div> + <div class="footer">Pied de page</div> </div> ``` @@ -217,9 +217,9 @@ La zone qu'on crée avec les noms doit être rectangulaires. Actuellement, il n' ```html hidden <div class="wrapper"> <div class="header">En-tête</div> - <div class="sidebar">Barre latérale</div> - <div class="content">Contenu</div> - <div class="footer">Pied de page</div> + <div class="sidebar">Barre latérale</div> + <div class="content">Contenu</div> + <div class="footer">Pied de page</div> </div> ``` @@ -305,9 +305,9 @@ On peut ensuite redéfinir la disposition à l'intérieur des différentes _medi ```html hidden <div class="wrapper"> <div class="header">En-tête</div> - <div class="sidebar">Barre latérale</div> - <div class="content">Contenu</div> - <div class="footer">Pied de page</div> + <div class="sidebar">Barre latérale</div> + <div class="content">Contenu</div> + <div class="footer">Pied de page</div> </div> ``` @@ -359,9 +359,9 @@ Pour la zone dédiée à l'image, on crée une zone de grille intitulée `img` e <div class="image"></div> <div class="text"> Dans cet exemple, on peut utiliser - grid-template-areas pour échanger les + grid-template-areas pour échanger les places du texte et du media. - </div> + </div> </div> ``` @@ -410,7 +410,7 @@ Si on a besoin d'afficher l'image d l'autre côté, il suffit de redéfinir une Dans cet exemple, on peut utiliser grid-template-areas pour échanger les places du texte et du media. - </div> + </div> </div> ``` diff --git a/files/fr/web/css/css_grid_layout/index.md b/files/fr/web/css/css_grid_layout/index.md index 44d108bb14..c12be3bbbc 100644 --- a/files/fr/web/css/css_grid_layout/index.md +++ b/files/fr/web/css/css_grid_layout/index.md @@ -16,7 +16,7 @@ Comme les tableaux, la grille permet d'aligner des éléments sous forme de colo ## Un exemple simple -Dans l'exemple qui suit, on montre comment utiliser une grille avec trois pistes en colonnes pour laquelle les nouvelles lignes créées mesureront au moins 100 pixels et auront au plus la taille automatique (définie par leur contenu). Les éléments sont placés sur la grille grâce aux numéros des lignes horizontales et verticales. +Dans l'exemple qui suit, on montre comment utiliser une grille avec trois pistes en colonnes pour laquelle les nouvelles lignes créées mesureront au moins 100 pixels et auront au plus la taille automatique (définie par leur contenu). Les éléments sont placés sur la grille grâce aux numéros des lignes horizontales et verticales. ```css hidden * {box-sizing: border-box;} diff --git a/files/fr/web/css/css_grid_layout/line-based_placement_with_css_grid/index.md b/files/fr/web/css/css_grid_layout/line-based_placement_with_css_grid/index.md index 645a3b0972..a4dcf27d56 100644 --- a/files/fr/web/css/css_grid_layout/line-based_placement_with_css_grid/index.md +++ b/files/fr/web/css/css_grid_layout/line-based_placement_with_css_grid/index.md @@ -135,7 +135,7 @@ On peut placer chacun des éléments individuellement et on peut également choi ## Les propriétés raccourcies `grid-column` et `grid-row` -On a écrit beaucoup de règles pour positionner chaque élément. Heureusement, il existe des propriétés raccourcies qui permettent d'avoir une syntaxe plus concise. Les propriétés {{cssxref("grid-column-start")}} et {{cssxref("grid-column-end")}} peuvent être combinées pour former la propriété raccourcie {{cssxref("grid-column")}} et de la même façon, {{cssxref("grid-row-start")}} et {{cssxref("grid-row-end")}} peuvent être synthétisées avec {{cssxref("grid-row")}}. +On a écrit beaucoup de règles pour positionner chaque élément. Heureusement, il existe des propriétés raccourcies qui permettent d'avoir une syntaxe plus concise. Les propriétés {{cssxref("grid-column-start")}} et {{cssxref("grid-column-end")}} peuvent être combinées pour former la propriété raccourcie {{cssxref("grid-column")}} et de la même façon, {{cssxref("grid-row-start")}} et {{cssxref("grid-row-end")}} peuvent être synthétisées avec {{cssxref("grid-row")}}. ```css hidden * {box-sizing: border-box;} |