Table des matières

Le Tutoriel de CSS max-width et min-width

View more Tutorials:

1- CSS max-width

CSS max-width est utilisé pour définir la largeur maximale d'un élément. Il empêche la largeur de l'élément de dépasser une valeur spécifiée.
Remarque: CSS width, min-width, max-width ne fonctionnent que pour les éléments Block et Inline-Block.
L'example avec  CSS max-width:
Syntax
/* «length» value */
max-width: 3.5em;

/* «percentage» value */
max-width: 75%;

/* Keyword values */
max-width: none;
max-width: max-content;
max-width: min-content;
max-width: fit-content;
max-width: fill-available;

/* Global values */
max-width: inherit;
max-width: initial;
max-width: unset;
Les valeurs possibles de  CSS max-width:
«length»
Spécifiez une valeur spécifique pour la largeur maximale. Par exemple​​​​​​​ 150px, 30cm,...
«percentage»
La valeur en pourcentage par rapport à la largeur de l'élément parent.
none
La largeur de l'élément n'est pas limitée.
max-content, min-content, fit-content, stretch

2- CSS min-width

CSS min-width ​​​​​​​est utilisé pour définir la largeur minimale d'un élément. Il empêche la largeur de l'élément de moins d'une valeur spécifiée.
Remarque:  CSS width, min-width, max-width ne fonctionnent que pour les éléments Block et Inline-Block.
Syntax
/* «length» value */
min-width: 3.5em;

/* «percentage» value */
min-width: 75%;

/* Keyword values */
min-width: auto;
min-width: max-content;
min-width: min-content;
min-width: fit-content;
min-width: fill-available;

/* Global values */
min-width: inherit;
min-width: initial;
min-width: unset;
L'example avec  CSS min-width:
Les valeurs possibles de  CSS min-width:
«length»
Spécifiez une valeur spécifique pour la largeur minimale. L'example 150px, 30cm, ..
«percentage»
La valeur en pourcentage par rapport à la largeur de l'élément parent.
none
Le navigateur calculera et sélectionnera automatiquement la valeur de  min-width. .
max-content, min-content, fit-content, stretch

View more Tutorials: