Bootstrap 4 Grille empilée à l'horizontale

Exemple de grille Bootstrap 4 : empilé à l'horizontale

Nous allons créer un système de grille de base qui commence par être empilé sur de très petits appareils, avant de devenir horizontal sur des appareils plus grands.

L'exemple suivant montre une simple disposition à deux colonnes "empilée à horizontale", ce qui signifie qu'elle entraînera une répartition 50 %/50 % sur tous les écrans, à l'exception des écrans très petits, qu'elle empilera automatiquement (100 %) :

Conseil : Vous pouvez transformer n'importe quelle mise en page à largeur fixe en une mise en page pleine largeur en modifiant la .containerclasse en.container-fluid :

Colonnes de disposition automatique

Dans Bootstrap 4, il existe un moyen simple de créer des colonnes de largeur égale pour tous les appareils : il suffit de supprimer le nombre de et d'utiliser uniquement la classe sur un nombre spécifié d' éléments col . Bootstrap reconnaîtra le nombre de colonnes et chaque colonne aura la même largeur. Les classes de taille déterminent quand les colonnes doivent être réactives :.col-size-*.col-size