Grokking CSS Design Patterns to Ace Interviews/

...

/

Solution: Equal Height Subgrid Layout

Solution: Equal Height Subgrid Layout

Let’s create a multi-level grid layout with consistent row heights by using CSS subgrid to inherit row sizing from the parent grid.

We'll cover the following...

Problem description

A parent .parent-grid defines two columns and multiple rows of equal height. Each cell contains a .child-grid that should align its own rows to the parent’s row heights. The task is to use display: ...