Catalog / Skills

CSS Grid Math

Derive and debug CSS Grid layout math for grid coordinates, line placement, spans, negative indexes, fr units, minmax(), fit-content(), repeat(), auto-fill, and auto-fit. Use when building grid systems, explaining track sizing, troubleshooting fr distribution, placing items by line numbers, or converting a layout sketch into CSS Grid formulas.

Frontendv0.1.0MITfrontendcssgridlayoutmath

Install

npx skills add LVTD-LLC/skills --skill css-grid-math

From `SKILL.md`

Use this skill when a grid needs to be reasoned about as a coordinate and sizing system. It helps calculate where items land, how tracks divide space, and why flexible tracks do not always produce expected widths.