CSS Grid: 2 Column Pattern with Header and Footer

This is example shows a two column pattern, with header and footer. The centre panel contains a number of boxes. We want to have as many in each row as will fit, with the boxes lining up as rows and columns.

The fallback uses Flexbox, we need to constrain the items in the flex layout in order to get the appearance of two-dimensional alignment.

My header
Panel A
Panel B
Panel C
Panel D
Panel E
Panel F
Panel G
Panel H
Panel I
Panel J
My footer