Чем `gap` отличается от `margin` в системах отступов?

Question

Accepted Answer

## Сравнение

**`gap`** (flex/grid/multi-column) задаёт **промежутки между элементами**, не снаружи контейнера. Не нужен «хак» с отрицательными margin и нет лишнего отступа у крайних детей.

**`margin`** — внешний отступ **у конкретного бокса**; схлопывается у блочных элементов по вертикали; удобен для уникальных исключений.

```css
.stack {
  display: flex;
  flex-direction: column;
  gap: 1rem; /* равномерно между всеми */
}
.stack > .featured {
  margin-block: 2rem; /* исключение */
}
```

В дизайн-системах: базовый ритм через `gap` у layout-примитивов; `margin` — точечные отклонения. `gap` не заменяет margin для отступа от границ родителя — там `padding` контейнера.