La grille

Grid permet de découper un espace en lignes et colonnes afin d'y répartir vos bloques.

Grille

DéfinitionDéfinir une grille

La grille est une balise parent dans laquelle on pourra positionner les enfants.

La balise parent doit contenir la propriété :

1
display: grid;

ExempleExemple de code

HTML

1
<main>
2
    <div id="div1">
3
        Contenu 1
4
    </div>
5
    <div id="div2">
6
        Contenu 2
7
    </div>
8
    <div id="div3">
9
        Contenu 3
10
    </div>
11
</main>
12

CSS

1
main {
2
  display: grid;
3
}