Qu'est-ce que la propriété gap en CSS ?
La propriété gap définit l'espace entre les éléments enfants dans un conteneur Flex ou Grid, sans ajouter de marge sur les bords extérieurs. C'est la méthode moderne et propre pour gérer les gouttières entre éléments.































































Demandes illimitées, résultats rapides
Soumettez autant de briefs que vous le souhaitez. Nos plans vous permettent de gérer un flux continu de demandes design, sans limite et sans friction, et à un coût économique.
Fonctionnement de gap
gap est un raccourci pour row-gap et column-gap. Avec une seule valeur, l'espacement est uniforme. Avec deux valeurs, la première définit l'écart vertical et la seconde l'écart horizontal. Gap fonctionne nativement avec Flexbox et Grid, et ne crée jamais d'espace indésirable en début ou fin de conteneur.































































Demandes illimitées, résultats rapides
Soumettez autant de briefs que vous le souhaitez. Nos plans vous permettent de gérer un flux continu de demandes design, sans limite et sans friction, et à un coût économique.
Conclusion
Gap est la solution élégante et moderne pour gérer les espacements dans les layouts Flex et Grid. Elle simplifie le code, évite les marges parasites et rend les mises en page plus prévisibles.
À retenir
- Espace entre éléments dans Flex et Grid
- Raccourci de row-gap et column-gap
- Remplace les techniques basées sur margin
- Pas d'espace en début/fin de conteneur
- Supporté par tous les navigateurs modernes
Demandes illimitées, résultats rapides
Soumettez autant de briefs que vous le souhaitez. Nos plans vous permettent de gérer un flux continu de demandes design, sans limite et sans friction, et à un coût économique.