Gaps

gap, row-gap, column-gap properties

Gaps are empty spaces between elements in a flex container. There are 2 types of gaps, column and row gaps.

FieldValue
CascadesNo
Initial value0
Applies Toflex containers

Values

Accepts any expression or value that resolves to an auto or a <length>.

Examples

span {
  gap: 0;
}

span {
  gap: 2px;
}
span {
  /* Equivalent to the above example */
  row-gap: 2px;
  column-gap: 2px;
}

span {
  gap: 1px 2px;
}
span {
  /* Equivalent to the above example */
  row-gap: 1px;
  column-gap: 2px;
}