Skip to main content

Що робить subgrid? Чим subgrid відрізняється від вкладених grid-контейнерів?

subgrid - це значення для grid-template-columns або grid-template-rows, яке дозволяє вкладеному елементу використовувати сітку батька, а не створювати свою власну. Він «успадковує» лінії батьківського грида і вирівнює дочірні елементи по тих самих лініях.

Різниця зі звичайними вкладеними Grid-контейнерами:

ВаріантЯк працює
Вкладений Grid-контейнерУсередині створюється нова сітка, не пов'язана з батьківською. Лінії й треки ніяк не збігаються автоматично.
subgridДочірній елемент використовує ту саму сітку, що й батько: спільні лінії, спільний ритм колонок/рядків.

Головна суть: subgrid потрібен тоді, коли потрібне узгоджене вирівнювання елементів на різних рівнях вкладеності, без ручного підганяння і дублювання розмірів треків.

Коротка відповідь

Для співбесіди
Premium

Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.