CSS GridLayout

Subgrid Layout

A responsive grid layout using CSS subgrid. The left column spans all rows while the right column inherits row tracks from the parent.

Layout Variants

3 items

main

subgrid 1

subgrid 2

grid-row: 1 / -1

subgrid row 1

subgrid row 2

Parent Grid

Defines the row template that children can inherit

Subgrid Child

Uses grid-template-rows: subgrid to align with parent tracks