Grid by Example

Everything you need to learn CSS Grid Layout

Line-based placement spanning tracks with the span keyword

We can also span using the span keyword. This example creates the same layout as the one in example 5. I am using the span keyword rather than targeting the Grid Line by number. I am also using the defaults for row and column end, which is to span 1.

Read the specification | View example as full page

See the Pen Grid by Example 6: Line-based placement span keyword by rachelandrew (@rachelandrew) on CodePen.