Помещение элемента div-разделителя между строкой элемента сетки с помощью js создает пространство ниже до следующей стро ⇐ CSS

[Anonymous]

у меня есть следующая сетка — вот ручка https://codepen.io/evavienna/pen/gOJywrx

Код: Выделить всё

    
#out {
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr 1fr 1fr 1fr;
gap: 50px 10px;
}

#spacer {
height: 80px;
grid-column: 1 / -1;
}

и я «вставляю» после загрузки следующего набора продуктов прокладку с js под последним элементом div продукта

Код: Выделить всё

К сожалению, высота в 80 пикселей применима к элементу-разделителю, но под ним находится огромный пробел, аналогичный высоте одного элемента div продукта. Есть идеи, как это исправить?

Подробнее здесь: https://stackoverflow.com/questions/786 ... ce-below-t