Что такое auto-placement в CSS Grid?

Question

Accepted Answer

## Как это устроено

**Auto-placement** — алгоритм Grid, который сам расставляет элементы по ячейкам, если вы не задали явные `grid-column` / `grid-row` / `grid-area`.

Порядок обхода зависит от `grid-auto-flow`: по умолчанию `row` (слева направо, затем следующая строка). Есть `column`, а также суффикс `dense` — уплотняет «дыры» от элементов, занимающих несколько ячеек.

---

## Практика

```css
.grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-auto-flow: dense;
}
.wide { grid-column: span 2; }
```

Без явных линий элемент займёт следующую свободную ячейку по правилам flow. Для предсказуемой вёрстки часто комбинируют explicit placement для ключевых блоков и auto-placement для остального.

---

## На собеседовании

Упомяните: `grid-auto-rows` / `grid-auto-columns` задают размер *неявно* создаваемых треков, а auto-placement решает *куда* положить item.