Как сделать горизонтальный скролл блоков в два ряда?

Question

[Alexey10]

Как сделать, чтобы заполнялся блоками только до второго ряда (не переходил на третий) , а затем включался горизонтальный скролл ? (блоки могут быть разных размеров) Может плагин есть, или код js , или просто на css есть вариант.

Comments

[Вадим]

А адаптив нужен?
А новый элемент, первый который попадёт в скролл, куда должен попасть? В первую строку, или вторую?
А второй элемент в скроле?

[Alexey10]

Вадим, 1. адаптив нужен; 2. Не важно;

Answer 1

[Elena Fire]

Родительский div

.parent-div {
display: flex;
}
.parent-div .first-line {
width: 100%;
height: [ровно по высоте строки с элементами]
}
.parent-div .second-line {
width: calc(100% + 100%);
height: [ровно по высоте элементов];
overflow: hidden;
overflow-x: scroll [или auto];
}