Dans le cours : La mise en page CSS : Combiner les flex et les grids

Accédez au cours complet aujourd’hui

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

Accrocher des éléments dans la grille

Accrocher des éléments dans la grille

Pour le moment, chaque élément de ma grille, chaque grid item, ou dans mon cas, chacun des éléments li de mon ul, occupe une cellule dans la grille que j'ai définie dans la vidéo précédente. Et tout cela s'est fait de manière automatique. Cela dit, vous aurez souvent besoin de mise en page plus complexe, avec des éléments qui s'étalent sur plusieurs cellules de grille. Dans cette vidéo, voyons comment accrocher nos grid-items dans les cellules de la grille. Pour cela, je vais d'abord faire réapparaître ma grille grâce aux outils de développement de mon navigateur. Clic droit n'importe où dans ma page, je clique sur Inspecter. Je bascule ici dans l'onglet Layout, et c'est là que je trouve cette fameuse petite case à cocher qui me permet de voir la grille que j'ai définie au niveau de mon élément ul. Vous voyez ici les différentes cellules de grille. Pour générer les cellules de cette grille, le navigateur a dû générer des grid lines, des lignes de grille. Au niveau des colonnes, nous…

Table des matières