07 Explained solutions
Compare the reasoning, not just the final appearance. Other correct solutions can satisfy the same requirements.
1. Available space
There are two gaps, totaling 48px. The tracks share 720 − 48 = 672px, so each is 224px. Three gaps would incorrectly count an outer gap that Grid does not add.
2. Auto placement
With normal row-wise auto placement, the fourth article starts the second row in the first column. Reading order remains the same as source order. No nth-child positioning is required.
3. Direct children again
The section’s heading, paragraph, and event-grid div would become its grid items. The event articles remain inside their own wrapper, so the expected three-card layout would not appear. Apply the layout to .event-grid. Choose the container according to the relationship you intend to arrange.