Dans le cours : CSS : Maîtriser les Flexbox

Accédez au cours complet aujourd’hui

Inscrivez-vous aujourd’hui pour accéder à plus de 24 100 cours dispensés par des experts.

Créer une grille de cartes avec les flexbox

Créer une grille de cartes avec les flexbox - Tutoriel CSS

Dans le cours : CSS : Maîtriser les Flexbox

Démarrer mon mois d’essai gratuit Acheter pour mon équipe

Créer une grille de cartes avec les flexbox

“

Dans ce chapitre, nous allons nous occuper de la zone de contenu principale. Vous voyez que j'ai remplacé les quelques paragraphes de texte que l'on avait précédemment par d'autres éléments qui ont tous la même structure. Ça commence par une image, puis un peu de texte et le bouton En savoir plus, dans le fond. On appelle ce type d'éléments des cartes. Maintenant, nous allons utiliser les flexbox pour réaliser une mise en page, responsive bien sûr, sous forme de carte. On commence par les écrans les plus étroits. Sur les écrans les plus étroits, ces cartes sonnent plutôt pas mal. Les problèmes arrivent lorsque l'écran s'élargit. Sur les écrans les plus larges, je voudrais placer ces cartes côte à côte. Dans mon code HTML, je travaille toujours avec ce div qui s'appelle content. À l'intérieur de ce div, on a toujours deux éléments, une section et un élément aside. L'élément section s'appelle toujours main content mais, maintenant, cet élément a une classe, la classe "cards". Dans cette…

Table des matières