Чем gap отличается от margin и почему его лучше использовать в Grid и Flex?

`gap` задаёт промежуток между элементами контейнера, а `margin` — внешний отступ у самого элемента.

Преимущества gap

• Отступ только между элементами, без лишнего края: не нужно убирать margin у первого или последнего.
• Не схлопывается и не требует хитростей с :last-child.
• Одно правило для всех детей, включая добавленные позже.
• Работает и в Grid, и в Flexbox (в современных браузерах).

.list {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px; /* вертикальный и горизонтальный */
}

Когда нужен margin

Когда отступ нужен у конкретного элемента (отодвинуть кнопку вправо с margin-left: auto) или вне контейнера с Grid и Flex.

Коротко для собеседования

gap описывает расстояние между соседями на уровне контейнера. Он проще и надёжнее, чем margin у каждого элемента.