no-unused-areas

Disallow named template areas that are never referenced by a single-name grid-area declaration in the same stylesheet.

This rule is intentionally not recommended by default. It is useful when grid containers and grid items are authored together, but it can be noisy when templates and items live in separate files.

Incorrect

.layout {
  grid-template-areas: "header main";
}

.main {
  grid-area: main;
}

Related Rules

• no-unknown-areas catches item assignments that do not exist in any same-stylesheet template.
• no-overlapping-areas catches duplicate single-name assignments.
• grid-all enables this stricter same-stylesheet rule.

Correct

.layout {
  grid-template-areas: "header main";
}

.header {
  grid-area: header;
}

.main {
  grid-area: main;
}