Styleguide
Retour sommaire

Grille

Grille

Composant de base

1
2
1
2

Définition du nombre de colones

Ajouter le modifier .l-grid__item--X-XX à l'élément ayant la classe .l-grid__item afin de modifier son nombre de colonnes.

Le dernier nombre de la chaine de caractères (ex : -50) correspond à la largeur en pourcentage (50%).

Modifiers disponibles :

TailleValeurs
Taille s - de 480px à 768pxs-20 s-25 s-33 s-40 s-50 s-60 s-66 s-75
Taille s-up - sup à 480pxs-up-20 s-up-25 s-up-33 s-up-40 s-up-50 s-up-60 s-up-66 s-up-75 s-up-80
Taille m - de 768px à 1049pxm-20 m-25 m-33 m-40 m-50 m-60 m-66 m-75 m-80
Taille m-up - sup à 768pxm-up-20 m-up-25 m-up-33 m-up-40 m-up-50 m-up-60 m-up-66 m-up-75 m-up-80
Taille l-up - sup à 1049pxl-up-20 l-up-25 l-up-33 l-up-40 l-up-50 l-up-60 l-up-66 l-up-75 l-up-80
1
2
3
4
5
6
7
8
9
10
11
1
2
3
4
5
6
7
8
9
10
11