How is “grid-template-rows: auto auto 1fr auto” interpreted?

Question

Recently, I created a layout using CSS grid. While this works well, I\'m confused by how it works. Specifically, I\'m confused about the line grid-template-rows: auto

Answer 1

The fr unit represents a fraction of the leftover space in the grid container.

The leftover space is calculated after auto etc.