Responsive

?

Conteneurs

Conteneurs servant à créer des colonnes adaptables en fonction du support utilisé.

Ils peuvent être utilisés pour placer des articles, un menu (horizontal comme vertical), les tuiles d'une application, et bien d'autres encore.

Les supports utilisés sont : Ordinateur / Tablette / Smartphone.
Points de rupture utilisés : 1025px et 767px.


Fonctionnement :

La class se compose de 3 parties :
- Le "c" (c4 dans l'exemple) correspond au nombre de colonnes pour le format ordinateur.
- Le "t" (t2 dans l'exemple) correspond au nombre de colonnes pour le format tablette.
- Le "s" (s1 dans l'exemple) correspond au nombre de colonnes pour le format smartphone.
- Si votre format smartphone est identique au format tablette, alors vous n'êtes pas obligé de mettre le "s", pareil, si seul votre format smartphone change, vous pouvez alors ignorer le "t" du format tablette. Et si vous ne souhaitez aucun changement quel que soit le support, vous aurez seulement besoin du "c".
- Mettre un c/t/s en minuscule ajoutera un padding de 20px au conteneur.
- Mettre un C/T/S en majuscule n'ajoutera pas de padding au conteneur.
Vous pouvez alterner entre les majuscules et les minuscules pour jouer avec les padding.

Le nombre de colonnes peut varier de 0 à 10 et comprend également des colonnes mesurant 2 tiers de la largeur (2_3) et 3 quarts de la largeur (3_4), peut importe le format.
Utiliser une colonne de 0 selon le format peut servir, par exemple, à faire disparaître un bloc ou une partie de la page en format smartphone, ou à remplacer un bloc par un autre au changement de support.

Des colonnes de divers formats peuvent être mixées ensemble (pour vous aider à calculer, la valeur en pourcentage est disponible, 100% étant la valeur maximum au delà de laquelle les éléments suivants passeront à la ligne).

Vous êtes libre d'organiser à votre guise chaque colonne en fonction de chaque support.