Как поместить в grid полоску?

Question

[privat13]

Добрый день. Переделываю чужую работу. Все уже запрограммировано. Поэтому нужно решить вопрос с помощью css или scss.
Есть сетка элементов размещенная с помощью grid. Как мне между рядами поместить красные полоски?



Нюанс в том, что количество выводимых элементов разное. Может быть и одна строка, тогда красная полоска не нужна. как только появляется вторая и последующие строки, то красные полоски между рядами нужно отобразить.

Comments

[privat13]

Решил вопрос.
Для каждого элемента создал два абсолютно спозиционированных псевдокласса. Один отвечает за одну полоску, другой за другую.
Применил псевдоклассы с восьмого элемента и до конца.
На картинке специально разделил полоску для наглядности

[Сергей delphinpro]

privat13, а решение с градиентами НЕ ЗАВИСИТ от количества элементов, их размера и расстояния между ними..
Ты смотри немножко на предлагаемые решения. Даже если их не понимаешь сразу.

Answer 1

[Сергей delphinpro]

нарисовать градиентом на фоне грид-контейнера

Comments

[Kentavr16]

Обалдеть. Не подскажете где такому кунг-фу можно научиться?

[privat13]

этот вариант не подходит... так как может быть разное количество строк

[Алексей Уколов]

privat13, что конкретно "не подходит"?

[privat13]

В комментарии к первому сообщению написал решение. Без фонов.

[Ankhena]

privat13,

так как может быть разное количество строк

И как это мешает градиенту на фоне?
Если не нужна для единственной строки, то сделать градиент чуть ниже высоты блока (т.е. оставить блок без паддингов)

Всяко лучше кучи псевдоэлементов.

[Сергей delphinpro]

privat13, а ты пробовал мой пример смотреть на разных разрешениях экрана? Или просто ляпнул не подумав и не проверив?
Я учел разное количество строк.
Даже два блока в примере сделал, с одной и с несколькими строками.

[privat13]

Сергей delphinpro, разъясни конкретнее... на примере как реализовать. И прошу вести беседу корректнее

[Сергей delphinpro]

privat13, я же показал пример. куда еще конкретнее.

[privat13]

Сергей delphinpro, Согласен. Мой косяк. Невнимательно посмотрел. Усталость.