From 149319bb8c7b1394a443f0877c3460cd362aa815 Mon Sep 17 00:00:00 2001 From: julieng Date: Fri, 17 Sep 2021 20:58:15 +0200 Subject: move *.html to *.md --- files/fr/web/css/minmax()/index.html | 155 ----------------------------------- files/fr/web/css/minmax()/index.md | 155 +++++++++++++++++++++++++++++++++++ 2 files changed, 155 insertions(+), 155 deletions(-) delete mode 100644 files/fr/web/css/minmax()/index.html create mode 100644 files/fr/web/css/minmax()/index.md (limited to 'files/fr/web/css/minmax()') diff --git a/files/fr/web/css/minmax()/index.html b/files/fr/web/css/minmax()/index.html deleted file mode 100644 index 5ca7fb623d..0000000000 --- a/files/fr/web/css/minmax()/index.html +++ /dev/null @@ -1,155 +0,0 @@ ---- -title: minmax() -slug: Web/CSS/minmax() -tags: - - CSS - - CSS Function - - CSS Grid - - Function - - Layout - - Reference - - Web -translation_of: Web/CSS/minmax() ---- -
{{CSSRef}}
- -

La fonction CSS minmax() définit un intervalle de taille supérieure ou égale à min et inférieure ou égale à max. Elle est utilisée avec les grilles CSS.

- -
{{EmbedInteractiveExample("pages/css/function-minmax.html")}}
- -

Syntaxe

- -
/* Valeurs de type <inflexible-breadth>, <track-breadth>*/
-minmax(200px, 1fr)
-minmax(400px, 50%)
-minmax(30%, 300px)
-minmax(100px, max-content)
-minmax(min-content, 400px)
-minmax(max-content, auto)
-minmax(auto, 300px)
-minmax(min-content, auto)
-
-/* Valeurs de type <fixed-breadth>, <track-breadth> */
-minmax(200px, 1fr)
-minmax(30%, 300px)
-minmax(400px, 50%)
-minmax(50%, min-content)
-minmax(300px, max-content)
-minmax(200px, auto)
-
-/* Valeurs de type <inflexible-breadth>, <fixed-breadth> */
-minmax(400px, 50%)
-minmax(30%, 300px)
-minmax(min-content, 200px)
-minmax(max-content, 200px)
-minmax(auto, 300px)
-
- -

minmax() est une fonction qui prend deux paramètres, min et max.

- -

Chaque paramètre peut être une longueur (type <length>), un pourcentage (type <percentage>), une valeur de type <flex> ou l'un des mots-clés max-content, min-content, ou auto.

- -

Si max est supérieur à min, alors max sera ignoré et minmax(min,max) sera considéré comme min. Utilisée comme valeur maximale, une valeur de type {{cssxref("flex_value","<flex>")}} définit le facteur de flexibilité de la piste de la grille ; une telle valeur ne peut pas être utilisée comme minimum.

- -

Valeurs

- -
-
{{cssxref("<length>")}}
-
Une longueur non-négative.
-
{{cssxref("<percentage>")}}
-
Un pourcentage non-négatif. Cette valeur est relative à la taille en incise (inline) du conteneur de grille pour les pistes en colonnes et relative à la taille en bloc du conteneur de grille pour les pistes en lignes. Si la taille du conteneur de grille dépend de la taille de ses pistes, cette valeur <percentage> sera traitée comme auto. L'agent utilisateur pourra ajuster les contributions à la piste de taille intrinsèques selon la taille du conteneur de grille et augmenter la taille finale de la piste d'une quantité minimale pour respecter le pourcentage.
-
{{cssxref("<flex>")}}
-
Une valeur non-négative avec l'unité fr qui indique le facteur de flexibilité/extensibilité de la piste. Chaque piste dimensionnée avec une valeur de type <flex> occupera une part de l'espace restant proportionnellement à son coefficient de flexibilité.
-
max-content
-
Représente la plus grande contribution max-content pour les objets de la grille qui occupent la piste.
-
min-content
-
Représente la plus grande contribution min-content pour les objets de la grille qui occupent la piste.
-
auto
-
Utilisée comme maximum, cette valeur agira comme max-content. Utilisée comme minimum, elle représentera la plus grande des tailles minimales (définies par {{cssxref("min-width")}}/{{cssxref("min-height")}}) des objets de la grille qui occupent la piste.
-
- -

Syntaxe formelle

- -{{csssyntax}} - -

Propriétés CSS associées

- -

minmax() peut être utilisée pour les propriétés suivantes :

- - - -

Exemples

- -

CSS

- -
#container {
-  display: grid;
-  grid-template-columns: minmax(min-content, 300px) minmax(200px, 1fr) 150px;
-  grid-gap: 5px;
-  box-sizing: border-box;
-  height: 200px;
-  width: 100%;
-  background-color: #8cffa0;
-  padding: 10px;
-}
-
-#container > div {
-  background-color: #8ca0ff;
-  padding: 5px;
-}
-
- -

HTML

- -
<div id="container">
-  <div>
-    Aussi large que le contenu, large d'au plus 300 pixels.
-  </div>
-  <div>
-    Item flexible mais dont la largeur vaut au moins 200 pixels.
-  </div>
-  <div>
-    Item avec une largeur de 150 pixels.
-  </div>
-</div>
- -

Résultat

- -

{{EmbedLiveSample("Examples", "100%", 200)}}

- -

Spécifications

- - - - - - - - - - - - - - - - -
SpécificationÉtatCommentaires
{{SpecName("CSS Grid", "#valdef-grid-template-columns-minmax", "minmax()")}}{{Spec2("CSS Grid")}}Définition initiale.
- -

Compatibilité des navigateurs

- -

{{Compat("css.properties.grid-template-columns.minmax")}}

- -

Voir aussi

- - diff --git a/files/fr/web/css/minmax()/index.md b/files/fr/web/css/minmax()/index.md new file mode 100644 index 0000000000..5ca7fb623d --- /dev/null +++ b/files/fr/web/css/minmax()/index.md @@ -0,0 +1,155 @@ +--- +title: minmax() +slug: Web/CSS/minmax() +tags: + - CSS + - CSS Function + - CSS Grid + - Function + - Layout + - Reference + - Web +translation_of: Web/CSS/minmax() +--- +
{{CSSRef}}
+ +

La fonction CSS minmax() définit un intervalle de taille supérieure ou égale à min et inférieure ou égale à max. Elle est utilisée avec les grilles CSS.

+ +
{{EmbedInteractiveExample("pages/css/function-minmax.html")}}
+ +

Syntaxe

+ +
/* Valeurs de type <inflexible-breadth>, <track-breadth>*/
+minmax(200px, 1fr)
+minmax(400px, 50%)
+minmax(30%, 300px)
+minmax(100px, max-content)
+minmax(min-content, 400px)
+minmax(max-content, auto)
+minmax(auto, 300px)
+minmax(min-content, auto)
+
+/* Valeurs de type <fixed-breadth>, <track-breadth> */
+minmax(200px, 1fr)
+minmax(30%, 300px)
+minmax(400px, 50%)
+minmax(50%, min-content)
+minmax(300px, max-content)
+minmax(200px, auto)
+
+/* Valeurs de type <inflexible-breadth>, <fixed-breadth> */
+minmax(400px, 50%)
+minmax(30%, 300px)
+minmax(min-content, 200px)
+minmax(max-content, 200px)
+minmax(auto, 300px)
+
+ +

minmax() est une fonction qui prend deux paramètres, min et max.

+ +

Chaque paramètre peut être une longueur (type <length>), un pourcentage (type <percentage>), une valeur de type <flex> ou l'un des mots-clés max-content, min-content, ou auto.

+ +

Si max est supérieur à min, alors max sera ignoré et minmax(min,max) sera considéré comme min. Utilisée comme valeur maximale, une valeur de type {{cssxref("flex_value","<flex>")}} définit le facteur de flexibilité de la piste de la grille ; une telle valeur ne peut pas être utilisée comme minimum.

+ +

Valeurs

+ +
+
{{cssxref("<length>")}}
+
Une longueur non-négative.
+
{{cssxref("<percentage>")}}
+
Un pourcentage non-négatif. Cette valeur est relative à la taille en incise (inline) du conteneur de grille pour les pistes en colonnes et relative à la taille en bloc du conteneur de grille pour les pistes en lignes. Si la taille du conteneur de grille dépend de la taille de ses pistes, cette valeur <percentage> sera traitée comme auto. L'agent utilisateur pourra ajuster les contributions à la piste de taille intrinsèques selon la taille du conteneur de grille et augmenter la taille finale de la piste d'une quantité minimale pour respecter le pourcentage.
+
{{cssxref("<flex>")}}
+
Une valeur non-négative avec l'unité fr qui indique le facteur de flexibilité/extensibilité de la piste. Chaque piste dimensionnée avec une valeur de type <flex> occupera une part de l'espace restant proportionnellement à son coefficient de flexibilité.
+
max-content
+
Représente la plus grande contribution max-content pour les objets de la grille qui occupent la piste.
+
min-content
+
Représente la plus grande contribution min-content pour les objets de la grille qui occupent la piste.
+
auto
+
Utilisée comme maximum, cette valeur agira comme max-content. Utilisée comme minimum, elle représentera la plus grande des tailles minimales (définies par {{cssxref("min-width")}}/{{cssxref("min-height")}}) des objets de la grille qui occupent la piste.
+
+ +

Syntaxe formelle

+ +{{csssyntax}} + +

Propriétés CSS associées

+ +

minmax() peut être utilisée pour les propriétés suivantes :

+ + + +

Exemples

+ +

CSS

+ +
#container {
+  display: grid;
+  grid-template-columns: minmax(min-content, 300px) minmax(200px, 1fr) 150px;
+  grid-gap: 5px;
+  box-sizing: border-box;
+  height: 200px;
+  width: 100%;
+  background-color: #8cffa0;
+  padding: 10px;
+}
+
+#container > div {
+  background-color: #8ca0ff;
+  padding: 5px;
+}
+
+ +

HTML

+ +
<div id="container">
+  <div>
+    Aussi large que le contenu, large d'au plus 300 pixels.
+  </div>
+  <div>
+    Item flexible mais dont la largeur vaut au moins 200 pixels.
+  </div>
+  <div>
+    Item avec une largeur de 150 pixels.
+  </div>
+</div>
+ +

Résultat

+ +

{{EmbedLiveSample("Examples", "100%", 200)}}

+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationÉtatCommentaires
{{SpecName("CSS Grid", "#valdef-grid-template-columns-minmax", "minmax()")}}{{Spec2("CSS Grid")}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("css.properties.grid-template-columns.minmax")}}

+ +

Voir aussi

+ + -- cgit v1.2.3-54-g00ecf