Le bloc grille permet de composer des mises en page plus complexes. Il est réservé à des usages avancés.

Un bloc grille comporte une matrice de base : un nombre fixe de colonnes, et optionnellement un nombre fixe de rangées. Les éléments enfants s’inséreront selon cette grille.

Par défaut, un élément enfant occupera une seule unité de la grille. Si la matrice de base est de 5 unités, alors l’élément enfant occupera 1/5 de la largeur et occupera le premier carré de la matrice. Le deuxième élément enfant occupera le 2e carré de la matrice ; et ainsi de suite.

  1   2   3   4   5
+---+---+---+---+---+
| A | B |   |   |   |
|   |   |   |   |   |
|   |   |   |   |   |
+---+---+---+---+---+

Un élément enfant peut occuper plusieurs colonnes : c’est ce qui fait la force de la grille. Spécifier 3 colonnes à l’élément A et 2 colonnes à l’élément B donnera le résultat suivant :

+---+---+---+---+---+
| A | A | A | B | B |
|   |   |   |   |   |
|   |   |   |   |   |
+---+---+---+---+---+

Spécifier 3 colonnes et 2 rangées à l’élément A donnera le résultat suivant (un 3e élément C viendra se placer après les enfants A et B) :

+---+---+---+---+---+
| A | A | A | B | B |
| A | A | A | C |   |
|   |   |   |   |   |
+---+---+---+---+---+