Как связаны `flex-wrap` и `align-content`?

Question

Accepted Answer

## Взаимодействие

`align-content` распределяет **flex-линии** (ряды/колонки после переноса) вдоль поперечной оси.

Оно **почти бесполезно**, если `flex-wrap: nowrap` (одна линия) — для одной линии работает `align-items`.

Когда `flex-wrap: wrap` и высота контейнера больше суммы линий, `align-content` решает: `flex-start`, `center`, `space-between`, `stretch` и т.д.

```css
.wrap {
  display: flex;
  flex-wrap: wrap;
  align-content: space-between;
  height: 400px;
}
```

Итого: `align-items` — выравнивание items **внутри линии**; `align-content` — упаковка **линий** при multi-line flex.