Selector

@depth

Cells at the given depths of a grid with a third number, such as 1x1x8. @z is an alias.

Syntax

  • @depth(<n>, ...) { }
  • @z(<n>, ...) { }
  • @depth not (<n>) { }
n
A depth from 1, the outermost cells, an an+b formula, or odd / even.

Several arguments match any of them. Without a third grid number every cell is at depth 1.

Examples

A 1x1x8 chain, where each cell contains the next:

@grid: 1x1x8 / 60vmin;
@size: 80%;
margin: auto;
border-radius: 50%;
background: #000;

@depth(even) {
  background: #fff;
}

See also